MathJax在网页中的使用

MathJax允许你在网页中使用LaTeX，MathML或AsciiMath注解来包含数学公式，这些数学公式将使用JavaScript处理HTML，SVG或MathML方程式来产生，以显示在任何浏览器中。

有两种方法可以访问MathJax：最简单的方法是使用分布式网络服务（如cdnjs.com）提供的MathJax副本，但是也可以在本地机器上下载并安装MathJax的副本，或者在你的硬盘上使用（不需要网络访问）。本文给出了在您的Web站点上运行MathJax的最快和最简单的方法，但是您可能需要去官网查阅更详细得信息以进行自定义页面的设置。

#使用CDN

使用MathJax最简单的方法是直接接入内容分发网络（CDN）提供的公共链接。
有许多免费的CDN提供商提供MathJax的副本。一些提供“滚动版本”，即在发布时更新到最新可用版本的链接：

cdnjs.com（推荐）(https://cdnjs.com/)
jsdelivr.com 滚动
unpkg.com 滚动
rawgit.com(https://rawgit.com/)
gitcdn.xyz(http://gitcdn.xyz/)
raw.githack.com(http://docs.mathjax.org/en/latest/raw.githack.com)

如何接入？

1
2
3

<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

打开html网页文件，将上面的代码复制到到<head>块中。（如果需要的话，它也可以进入<body>，但<head>是首选）。这将从分布式服务器加载最新版本的MathJax，并将其配置为使用TeX，MathML和AsciiMath注解来识别数学，并要求它使用HTML与CSS生成其输出来显示数学。

TeX-MML-AM_CHTML配置是最一般的（也是最大的）组合配置文件之一，也有其他组合配置文件可用。还可以提供额外的配置参数来根据需要定制其中一种组合配置，或使用MathJax的开发工具来生成您自己的组合配置文件。

有关配置过程的更多细节可以在加载和配置MathJax中找到。

#TeX和LaTeX输入

为了显示数学公式，默认的数学分隔符是$$ ... $$和\ [... \]，对于内连数学公式，默认的数学分隔符是\（... \）。特别要注意 $ ... $ 内连分隔符不是默认的。因为美元符号经常出现在非数学公式的情况下，可能会导致误读。例如一句话，“…第一个为$ 2.50，而另外一个为$ 2.00 …”将导致“…第一个为 2.50”被视为数学公式，因为这句话出现在美元符号之间。出于这个原因，如果你想使用单数美元符号编写内连公式，就必须在你的配置中明确地启用：

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}
});
</script>
<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

参阅config / default.js文件或tex2jax配置选项页面，可以为tex2jax预处理器指定其他配置参数，tex2jax是MathJax的组件，用于标识页面内的TeX符号。有关MathJax对TeX的支持的更多信息，请参见TeX和LaTeX页面，特别是启用单一美元符号分隔符时，如何处理文本中的单个美元符号。

下面是一个包含TeX数学公式的完整示例页面（也可以在test / sample-tex.html文件中找到）：

<!DOCTYPE html>
<html>
<head>
<title>MathJax TeX Test Page</title>
<script type="text/x-mathjax-config">
  MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
</script>
<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
</head>
<body>
如果 $a \ne 0$, 则 \(ax^2 + bx + c = 0\) 方程会有两个解，分别为
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</body>
</html>

由于TeX符号是页面文本的一部分，因此在输入公式时，有一些注意事项。尤其是需要小心<的使用，因为它是浏览器用来指示HTML标签的开始。在<符号的两侧放置一个空格就行了，但请参阅TeX和LaTeX的支持细节。

TeX输入处理器有多个扩展名，由组合的配置文件加载，这些文件的文件名中包含TeX（例如TeX-AMS_CHTML）。包括：

TeX / AMSmath.js，定义了AMS数学环境和宏，
TeX / AMSsymbols.js，它定义msam10和msbm10字体中的符号的宏，
TeX / noErrors.js，当处理TeX出现问题时，它显示原始的TeX代码而不是错误信息，
TeX / noUndefined.js，防止未定义的宏产生错误信息，而以红色显示宏名。

其他扩展可能会在需要时自动加载。
其他可用的其他TeX扩展的详细信息，请参阅TeX和LaTeX支持。

#MathML输入

以MathML注解编写的数学公式，可以使用标准 $标记来标记数学，其中$ <math display ="block">表示显示的数学公式，<math display ="inline">或<math>表示内联数学公式。

在旧的浏览器上，也可以在HTML文件中使用，而不仅仅是XHTML文件（MathJax都能起作用），而且网页不需指定任何特殊的MIME类型。但是请注意，在HTML（不是XHTML）中，不应该在 $标签包含一个名称空间前缀。例如，除非在XHTML文件，已经通过添加$ xmlns:m ="http://www.w3.org/1998/Math/ MathML"属性到文件的标签，将m命名空间和MathML DTD绑定在一起，否则不能给 $标签添加命名空间前缀。最好在文档的所有标签中包含$ xmlns="http://www.w3.org/1998/Math/MathML"属性（推荐使用像m：以上这样的名称空间前缀，因为这些在HTML5中已被弃用），以便在最广泛的使MathML工作。这是一个包含MathML数学公式的完整示例页面（也可在test / sample-mml.html文件中获得）：

<!DOCTYPE html>
<html>
<head>
<title>MathJax MathML Test Page</title>
<script type="text/javascript" async
  src="https://example.com/MathJax.js?config=MML_CHTML">
</script>
</head>
<body>

<p>
如果
<math xmlns="http://www.w3.org/1998/Math/MathML">
  <mi>a</mi><mo>&#x2260;</mo><mn>0</mn>
</math>,
则
<math xmlns="http://www.w3.org/1998/Math/MathML">
  <mi>a</mi><msup><mi>x</mi><mn>2</mn></msup>
  <mo>+</mo> <mi>b</mi><mi>x</mi>
  <mo>+</mo> <mi>c</mi> <mo>=</mo> <mn>0</mn>
</math>
方程会有两个解，分别为
<math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
  <mi>x</mi> <mo>=</mo>
  <mrow>
    <mfrac>
      <mrow>
        <mo>&#x2212;</mo>
        <mi>b</mi>
        <mo>&#x00B1;</mo>
        <msqrt>
          <msup><mi>b</mi><mn>2</mn></msup>
          <mo>&#x2212;</mo>
          <mn>4</mn><mi>a</mi><mi>c</mi>
        </msqrt>
      </mrow>
      <mrow> <mn>2</mn><mi>a</mi> </mrow>
    </mfrac>
  </mrow>
  <mtext>.</mtext>
</math>
</p>

</body>
</html>

在HTML页面（不是XHTML页面）中输入MathML注释时，不应使用自闭标记，而应对所有数学元素使用明确的打开和关闭标记。例如应该使用
<mspace width =“5pt”> </ mspace>
而不是
<mspace width="5pt" />

如果使用自闭形式，一些浏览器将不会正确构建数学公式，MathJax将收到损坏的数学结构。
有关MathJax的MathML支持的更多信息，请参见MathML页面。

#AsciiMath输入

MathJax v2.0通过合并ASCIIMathML引入了一种新的输入格式：AsciiMath注解。默认情况下，用反单引号（即’…’）来标记数学表达式。
下面是一个包含AsciiMath表示法的完整示例页面（也可以在test / sample-asciimath.html文件中找到）：

<!DOCTYPE html>
<html>
<head>
<title>MathJax AsciiMath Test Page</title>
<script type="text/javascript" async
  src="https://example.com/MathJax.js?config=AM_CHTML"></script>
</head>
<body>

<p>如果 `a != 0`, 则 `ax^2 + bx + c = 0` 方程式会有两个解，分别为</p>
<p style="text-align:center">
  `x = (-b +- sqrt(b^2-4ac))/(2a) .`
</p>

</body>
</html>

在页面中识别asciimath符号的MathJax的组件称为asciimath2jax扩展，它只有一些配置选项; 有关更多详细信息，请参阅config / default.js文件或asciimath2jax配置选项页面。
有关MathJax的AsciiMath支持的更多信息，请参阅AsciiMath支持页面。