个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我使用 MathJax 来显示数学方程。它在静态编写的数学中运行良好。但不适用于动态添加的数学。
这是我的代码
<body>
//Static
<div>
<span>\(x = {-b \pm \sqrt{b^2-4ac} \over 2a}\)</span>
</div>
//Dynamic
<div id="dynamic-pan">
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#dynamic-pan').empty();
$('#dynamic-pan').append('<span>\(x = {-b \pm \sqrt{b^2-4ac} \over 2a}\)</span>');
});
</script>
</body>
我用两个跨度元素写了数学。第一个是静态声明的，第二个是在文档就绪函数中动态添加的
请帮我解决这个问题。
最佳答案
http://docs.mathjax.org/en/latest/web/typeset.html
MathJax.typeset() MathJax.typesetPromise() setTimeout(function () {
const content = document.createElement('span')
content.textContent = '\\(x = {-b \\pm \\sqrt{b^2-4ac} \\over 2a}\\)'
const done = document.createElement('span')
done.textContent = ' done!'
const syncTypeset = document.querySelector('#syncTypeset')
syncTypeset.appendChild(content.cloneNode(true))
setTimeout(function () {
MathJax.typeset()
syncTypeset.appendChild(done.cloneNode(true))
}, 3000)
const asyncTypeset = document.querySelector('#asyncTypeset')
asyncTypeset.appendChild(content.cloneNode(true))
setTimeout(async function () {
await MathJax.typesetPromise()
asyncTypeset.appendChild(done.cloneNode(true))
}, 3000)
}, 0)<script>
MathJax = {
tex: {
inlineMath: [['$', '$'], ['\\(', '\\)']]
},
svg: {
fontCache: 'global'
}
};
</script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script"></script>
//Static
<div>
<span>\(x = {-b \pm \sqrt{b^2-4ac} \over 2a}\)</span>
</div>
//Dynamic
<div id="syncTypeset">Sync after 3 second: </div>
<div id="asyncTypeset">Async after 3 seconds: </div>您需要告诉 MathJax 查找未处理的数学，这是使用 Typeset() 完成的方法，因为 MathJax 可能在调用 Typeset() 时正在运行你需要将它添加到它的队列中
$(document).ready(function() {
var $el = $('#dynamic-pan')
$el.empty()
$el.append('<span>\\(x = {-b \\pm \\sqrt{b^2-4ac} \\over 2a}\\)</span>')
MathJax.Hub.Queue(['Typeset', MathJax.Hub, $el[0]]);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML"></script>
//Static
<div>
<span>\(x = {-b \pm \sqrt{b^2-4ac} \over 2a}\)</span>
</div>
//Dynamic
<div id="dynamic-pan"></div>引用this document了解更多信息
编辑:字符\对字符串有特殊含义(它转义了以下字符)以避免此行为确保使用 \\让它出现在最后的字符串中
关于javascript - 使用 MathJax 排版/呈现动态内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36224691/
25
4
0
默认情况下，Bootstrap 有 @baseFontSize: 14px 和 @baseLineHeight: 20px。我打算使用 12px 作为我的 @baseFontSize。我是否应该将 @
最近我将我的 Material UI 版本从 3.9.4 升级到 4.11.0，我不得不在主题样式覆盖上替换这些: 为避免这些警告: 但是我需要将 fontSize 样式放在 !important 中
我使用 MathJax 来显示数学方程。它在静态编写的数学中运行良好。但不适用于动态添加的数学。 这是我的代码 //Static \(x = {-
在定制我的angular material theme's typography .我知道可以用自己的字体覆盖默认字体，如下所示: $custom-typography: mat-typography
各位seoer应该都明白，要想网站有排名，收录是前提条件，没有收录完全谈不上排名、流量。但是内页的收录往往是seo最大的难题之一，笔者手上有一堆网站都是只被收录了首页或者几页内页，因此解决内页收录问
我有一个 MathJax 示例，位于 Demo sample ，它按预期工作。它所做的只是在 id 为 mathDiv 的 div 中排版 latex 表达式。 当第三个 latex 表达式即将被排版
我正在尝试使用 iText7 创建 Bengli 文本的 pdf。其他文本似乎工作正常，但有一个。 PdfFont font = null; try { font = PdfFontFact
关闭。这个问题需要更多focused .它目前不接受答案。 想改进这个问题吗？ 更新问题，使其只关注一个问题 editing this post . 关闭 4 年前。 Improve this q
我有以下代码: UILabel *registerLabel = [ [UILabel alloc ] initWithFrame:CGRectMake(20.0, 90.0, [self scree
是MDC typography特定于 Roboto 字体，或者我们可以使用其他 Google 字体来实现，如果是这样，推荐的方法是简单地应用 font-family CSS 到 body ? 最后，似
有没有办法从 ipython/jupyter 文本编辑器编译/排版 Latex 文件？我希望能够编辑该文件，然后下载更新输出的 pdf 文件。 例如我目前将我的简历 (CV.tex) 存储在运行 ju
我一直在遵循有关排版的 Google 官方 Material 设计指南 (http://www.google.com/design/spec/style/typography.html)，但我发现它们
我是一名优秀的程序员,十分优秀！