MathJax是一个开源的基于Ajax的数学公式显示的解决方案,结合多种先进的Web技术,支持主流的浏览器。MathJax根据页面中定义的LaTex数据,生成对应的数学公式。具体可见:
因为是利用js解析,所以与用什么博客软件其实没有太大的关系,以下代码摘自typecho的官方论坛,因为引用的资源提示已下线,根据提示更换为了更新的源:
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { availableFonts: ["TeX"] }
});
</script>
<script type="text/javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
在页面的head部分插入以上代码,就可以在页面上生成数学公式了。比如象下面这样:
$$ 已知m^2+m-1=0,求代数式m^3+m^2+2003的值。 $$
因为平时经常使用字节跳动的静态资源公共库,所以也顺便去看了一眼字节的库,发现也包含了mathjax,可能因为组件较多的原因,第一次遇到读取卡顿,但并不死机,耐心等一会之后才能够正确显示所选择版本下的一堆文件,附上字节mathjax2.7.1版本的cdn地址:
<script src="https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/mathjax/2.7.1/MathJax.js" type="application/javascript"></script>
所以完整的代码也可以修改如下:
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { availableFonts: ["TeX"] }
});
</script>
<script type="text/javascript"
src="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>