五分钟上手MAthJax

Posted 阿布大人

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了五分钟上手MAthJax相关的知识,希望对你有一定的参考价值。

最近在研究,在页面中显示一些数学公式。搞得我很头疼。 据说MathJax会统一这已领域。所以去学了学。网上教程特别多。繁杂。 说的清楚的特别少。

 我是这么跑通的,:

1.在官网下载代码地址为:https://www.mathjax.org/

2.然后找到这个东西,下载源码。解压。不要动里面的配置文件。

 

3.解压后的文件是这个样子。

4.别动文件。全部放到文件中,引入MathJax.js就可以了。

这是一个小得demo 全码。粘贴进去就能用,

<!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>

</body>
</html>

这个插件有点大,或者这样子:

<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啦。

以上是关于五分钟上手MAthJax的主要内容,如果未能解决你的问题,请参考以下文章

五分钟上手Git

五分钟带你简单上手Web Components

十五分钟上手SoFlu全自动软件工程平台

五分钟玩转Microsoft Teams

Git五分钟教程

js每隔五分钟执行一个函数