如何触发MathJax？

Question

我在脚本中包括了MathJax

<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

这将自动将所有数学代码替换为格式化的标记。

1. 如何通过只单击javascript而不是在加载时触发MathJax。
2. 我如何告诉MathJax将格式化的元素放在页面的末尾而不是替换原始代码？

Answer 1

1.如何通过只单击javascript而不是在加载时触发MathJax。

来自文档：skipStartupTypeset: false

通常情况下，MathJax会在页面加载后立即在页面上排版数学。如果您想延迟这个过程，在这种情况下，您需要亲自调用MathJax.Hub.Typeset()，将这个值设置为true。

起始排版

MathJax.Hub.Typeset()命令还接受一个参数，该参数是一个DOM元素，其内容将是类型集。这可能是一个段落、一个元素，甚至是一个MathJax数学标记。它也可能是这样一个对象的DOM id，在这种情况下，MathJax将为您查找DOM元素。所以 MathJax.Hub.Queue(“排版”，MathJax.Hub，"MathExample")； 将排版包含在id为MathExample的元素中的数学。这相当于 变量数学= document.getElementById("MathExample")；MathJax.Hub.Queue(“排版”，MathJax.Hub，数学)； 如果没有提供任何元素或元素id，则整个文档都是排版的。

​

MathJax.Hub.Config({
    skipStartupTypeset: true,
    extensions: ["tex2jax.js", "TeX/AMSmath.js"],
    jax: ["input/TeX", "output/HTML-CSS"],
    tex2jax: {
        inlineMath: [["$", "$"]],
        processEscapes: true
    }
});

function startTypeSetting() {
  var HUB = MathJax.Hub;
  HUB.Queue(["Typeset", HUB, "render-me"]);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>
<p id="render-me">$a+b=c$<p>

<button onClick="startTypeSetting()">Start typesetting</button>

​

2.我如何告诉MathJax将格式化的元素放在页面的末尾而不是替换原始代码？

更好的方法是知道您想要实现什么，但是这里有两种方法可以跳过某些标记或类的排版，来自tex2jax预处理器吐露

MathJax.Hub.Config({
     tex2jax: {
         skipTags: ["script","noscript","style","textarea","pre","code"],
         ignoreClass: "tex2jax_ignore_1|tex2jax_ignore_2"
    }
}

您可以将要呈现的元素的内容复制到另一个元素，然后在那里开始排字：

​

MathJax.Hub.Config({
    skipStartupTypeset: true,
    extensions: ["tex2jax.js", "TeX/AMSmath.js"],
    jax: ["input/TeX", "output/HTML-CSS"],
    tex2jax: {
        inlineMath: [["$", "$"]],
        processEscapes: true
    }
});

function startTypeSetting() {
  //copy content from '#code-to-render' to '#render-point'
  var text = $('#code-to-render').val()
  $('#render-point').text(text)
  
  //Start typesetting
  var HUB = MathJax.Hub;
  HUB.Queue(["Typeset", HUB, "render-point"]);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>

<textarea id="code-to-render">$a+b=c$</textarea>
<p id="render-point"></p>

<button onClick="startTypeSetting()">Start typesetting</button>

​

Answer 2

对于MathJax 3，它是：

MathJax.typeset()