提醒：本文最后更新于 2024-02-11 23:32，文中所关联的信息可能已发生改变，请知悉！
引入
你可以根据服务端和客户端的网络状况选择合适的 CDN 服务器来引入。
官方 CDN
BootCDN
感谢国内免费 CDN 服务：BootCDN
有问题？
“?config=”是什么
详情在文后有提到。
“async”是什么
这是个
详细配置说明
MathJax.Hub.Config({
showProcessingMessages: false, // 关闭 js 加载过程信息
messageStyle: "none", // 不显示信息
extensions: ["tex2jax.js"],
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {inlineMath: [["$", "$"]], // 行内公式选择 $
displayMath: [["$$", "$$"]], // 独立段落公式选择 $$
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code', 'a'], // 避开某些标签
processEscapes: true
},
"HTML-CSS": {availableFonts: ["STIX", "TeX"], // 可选字体
showMathMenu: false // 关闭右击菜单显示
},
TeX: {extensions: ["AMSmath.js", "AMSsymbols.js", "extpfeil.js", "mhchem.js"] // 一些写化学式的包
},
CommonHTML: {matchFontHeight: false}
});大概如图所示了，你可以自行修改。
更多的优化配置
约束识别范围
目的是只让脚本识别 WordPress 文章内容里的公式识别符。
首先获取当前文章 id，赋值给变量mathId
var mathId = document.getElementById("post-content");然后在配置 MathJax.Hub.Config() 之后加上：
MathJax.Hub.Queue(["Typeset",MathJax.Hub,mathId]);意思就是只在 id 为 post-content 的标签内去识别。
你也可以在 MathJax.Hub.Config() 里加上：
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre','code','a']意思就是不识别这些标签里的文本。
去除公式周围的蓝框
css 里加上：
.MathJax{outline:0;}注意事项
以上配置仅作参考，请根据自己的实际情况选择。
兼容性问题
getElementById()的传入参数需要根据自己的实际情况选择，大概是把需要渲染的标签 id 输入即可。
比如这个示例，WordPress 的正文部分的标签 id 大概是“post-57”，“57”即为文章 id。所以需要先 document.getElementById("post-content") 获取一下。
var mathId = document.getElementById("post-content"); // 获取当前文章 id
window.MathJax.Hub.Queue(["Typeset", MathJax.Hub, document.getElementById(mathId)]); // 如果不传入第三个参数，则渲染整个 document最后
参见
MathJax 官网
MathJax | Beautiful math in all browsers.
CDN 来源
BootCDN - Bootstrap 中文网开源项目免费 CDN 加速服务
部分代码参考
MathJax Documentation — MathJax 2.7 documentation
前端整合 MathjaxJS 的配置笔记 2017-02-20
MathJax: 让前端支持数学公式 2018-10-04
其他
https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/script#%E5%B1%9E%E6%80%A7
