MAthJax入門教程(五分鐘上手)

最近在研究,在頁面中顯示一些數學公式。搞得我很頭疼。 聽說MathJax會統一這已領域。因此去學了學。網上教程特別多。繁雜。 說的清楚的特別少。javascript

 我是這麼跑通的,:html

1.在官網下載代碼地址爲:https://www.mathjax.org/java

2.而後找到這個東西,下載源碼。解壓。不要動裏面的配置文件。插件

 

3.解壓後的文件是這個樣子。翻譯

4.別動文件。所有放到文件中,引入MathJax.js就能夠了。3d

這是一個小得demo 全碼。粘貼進去就能用,cdn

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>MathJax AsciiMath Test Page</title>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {inlineMath: [['$','$'], ['\(','\)']]}
});
</script>
</head>
<body>
<div id="pop">
$$\frac{1}{2}$$
</div>htm

</body>
</html>blog

這個插件有點大,或者這樣子:教程

<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {inlineMath: [['$','$'], ['\(','\)']]}
});
</script>

這兩船代碼放到body底部就能夠了。

!!!ps:還有一條。有時候你的數學代碼是動態的,動態代碼加載到頁面上。MAthJax是不會從新渲染的。解決辦法是:

在加載事件後加入這段代碼。MathJax.Hub.Queue(["Typeset", MathJax.Hub]);(翻譯成中文就是:從新渲染。)。

而後,就成功的用了MathJax啦。

相關文章
相關標籤/搜索