概述
MathJax可以实现网页浏览器中的LaTex公式渲染。
引入
可以使用特定的模板形式引入和配置，具体可参考：配置mathjax — MathJax 3.2 文档 (osgeo.cn)。其中代码可以以CDN形式引入：mathjax (v3.2.2) -BootCDN。
<script>
MathJax = {tex: {inlineMath: [['$', '$'], ['\\(', '\\)']]}
};
</script>
<script id="MathJax-script" asyncsrc="https://cdn.bootcdn.net/ajax/libs/mathjax/3.2.2/es5/tex-chtml.js">
</script>
使用测试
以下是比较完整的HTML页面：
<!DOCTYPE html>
<html lang="en">
<head>
...
</head>
<body>
<p>$ a_2 = \sin \theta $</p><p>这是一个行内公式\(a_2 = \sin \theta\)。</p>
</body>
</html>
通过在body标签中使用$...$或\(...\)形式可以书写行内LaTex公式，浏览器打开后，渲染为：
<p>$ a_2 = \sin \theta $</p><p>这是一个行内公式\(a_2 = \sin \theta\)。</p>\begin{cases}
a_1 = \sin \theta \\
a_2 = \cos \theta
\end{cases}
详细配置
参考自：MathJax的基本使用 - 启明星工作室 - 博客园 (cnblogs.com)
MathJax = {options: {skipHtmlTags: [ // 不会搜索数学的HTML标签'script', 'noscript', 'style', 'textarea', 'pre','code', 'annotation', 'annotation-xml'],includeHtmlTags: { // 可以出现在数学中的HTML标签br: '\n', wbr: '', '#comment': ''},ignoreHtmlClass: 'tex2jax_ignore', // 标记不搜索标签的类processHtmlClass: 'tex2jax_process', // 标记应搜索的标签的类compileError: function (doc, math, err) {doc.compileError(math, err)},typesetError: function (doc, math, err) {doc.typesetError(math, err)},renderActions: {...}}
};
总结
MathJax的使用就是这么简单、朴实无华。官方文档写了一堆有的没的，实在是没搞懂能干什么。
