Web编程技术营地
研究、演示、创新

MathJax.js

撰写时间:2026-05-25

修订时间:2026-05-25

MathJax.js帮助我们在网页上书写数学公式。

CDN

MathJax.js V4CDN为:

Tex and LaTex input

行内与段落显示方式

HTML代码:

输出:

When \(a \ne 0\), there are two solutions to \(ax^2 + bx + c = 0\) and they are $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$

解析:

  1. 使用\(...\)来输入行内公式 (in-line mathematics)。
  2. 使用$$...$$\[...\]来输入段落公式 (displayed mathematics)。

对齐

HTML代码:

输出:

\begin{align} \dot{x} & = \sigma(y-x) \\ \dot{y} & = \rho x - y - xz \\ \dot{z} & = -\beta z + xy \end{align}

解析:

  1. 使用&,则每行以此作为对齐位置。
  2. 每行之后的\\,用于断行。

求和公式

最简单的求和公式

对于:

\[ 1 + 2 + 3 + 4 + 5 \]

可使用求和公式:

\[ \sum_{i=1}^5 i \]

来表示。公式整体含义为:对一系列的i值进行求和。其中i的起始值为1,结束值为5

HTML代码:

解析:

  1. \[...\]表示段落分界符。
  2. \sum表示求和符号。
  3. _表示下标。
  4. 含有多个字符的下标用{...}来包围。因此{i=1}表示整个下标的内容为i=1
  5. ^表示上标。同样,若上标含有多个字符,也用{...}来包围。
  6. 将需要求和的一系列的值i放在右边。

平方数的求和

对于:

\[ 1^2 + 2^2 + 3^2 + 4^2 + 5^2 \]

则:

\[ \sum_{k=1}^5 k^2 \]

表示:对一系列的\(k^2\)值进行求和。其中k的起始值为1,结束值为5

HTML代码:

综合实例

HTML代码:

输出:

\[ \left( \sum_{k=1}^n a_k b_k \right)^{\!\!2} \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]

解析:

  1. \left(\right)可让括号自动适配内部表达式的高度。
  2. \!是一个用于缩小间距的命令,代码^{\!\!2}让上标2向左两次缩小间距,以让上标符号更贴近相应的括号。
  3. \leq用以输出小于等于号。

矩阵

HTML代码:

输出:

\[ \mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \\ \end{vmatrix} \]

解析:

  1. \mathbf{V}的作用是将字母V设置为粗体,在数学排版中通常用于表示向量
  2. \begin{vmatrix}\end{vmatrix}标识一段可分列对齐的多行数据,多用于显示矩阵数据。其中vmatrix使用竖线作为分界符。
  3. 矩阵数据中,使用&作为列分界符,使用\\作为断行符。
  4. \frac表示除法,含有多字符的分子与分母使用{...}来分隔。
  5. \partial命令用以输出偏微分符号

下表列出在LaTex / MathJax中所支持的矩阵环境:

环境名称分界符类型示例
matrix 无分界符 \begin{matrix} 1 & 2 \\ 3 & 4 \end{matrix}
pmatrix 圆括号 \begin{pmatrix} 1 & 2 \\ 3 & 4 \end{pmatrix}
bmatrix 方括号 \begin{bmatrix} 1 & 2 \\ 3 & 4 \end{bmatrix}
Bmatrix 花括号 \begin{Bmatrix} 1 & 2 \\ 3 & 4 \end{Bmatrix}
vmatrix 单竖线 \begin{vmatrix} 1 & 2 \\ 3 & 4 \end{vmatrix}
Vmatrix 双竖线 \begin{Vmatrix} 1 & 2 \\ 3 & 4 \end{Vmatrix}

二项式系数

HTML代码:

输出:

\[ P(E) = {n \choose k} p^k (1-p)^{n-k} \]

解析:

  1. 整体公式为二项分布的概率质量函数,含义为:在n次独立重复试验中,每次成功概率为p,恰好成功k次的概率。
  2. n \choose k是一个二项式系数 (binomial coefficient),读作n 选 k,表示从n个不同元素中选k个的组合数,记作\(C(n,k)\)。

二项式系数的公式如下:

\[ {n \choose k} = \frac{n!}{k!(n-k)!} \]

n \choose kLaTex的旧式命令,现在推荐使用\binom{n}{k}。因此二项分布的概率质量函数也可书写如下:

输出:

\[ P(E) = \binom{n}{k} p^k (1-p)^{n-k} \]

无限循环表示法

HTML代码:

输出:

\[ \frac {1} {\left(\sqrt{\phi \sqrt{5}}-\phi\right) e^{\frac25 \pi}} = 1 + \dfrac {e^{-2\pi}} { 1 + \dfrac {e^{-4\pi}} { 1 + \dfrac {e^{-6\pi}} { 1 + \dfrac {e^{-8\pi}} {1+\ldots} } } } \]

解析:

  1. \frac的公式在行内样式中显示为较小的文本,在段落样式中显示为较大的文本;而\dfrac统一显示为较大的文本。
  2. \ldots输出3个点的省略号\(\ldots\),且其基线与逗号的顶部对齐。如:\(a, b, c, \ldots, z\)

\ldots相对应的有\cdots。其基线与运算符的中心对齐。如:

输出:

\[ x_1 + x_2 + \cdots + x_n \]

连乘符号

HTML代码:

输出:

\[ 1 + \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots = \prod_{j=0}^{\infty} \frac{1}{(1-q^{5j+2})(1-q^{5j+3})}, \quad\quad \text{for $|q| < 1$}. \]

解析:

  1. \cdots输出3个点的省略号\(\cdots\),其基线与运算符的中心对齐。
  2. \prod是乘积命令,与\sum命令一样,可使用下标与上标。例如:

    HTML代码:

    输出:

    \[ \prod_{j=0}^{\infty} a_j = a_0 \cdot a_1 \cdot a_2 \cdots \]

    表示无穷乘积,即从\(j=0\)到无穷大,对所有项\(a_j\)进行连乘。

  3. \quad是水平间距命令,用于插入一个等于当前字体中1em宽度的空白。可使用\qquad来插入2em宽度的空白。因此\quad\quad\qquad等效。
  4. \text命令输出文本。
  5. 段落公式本应使用$$...$$的格式输出。但在\[...\]环境中,已明确系MathJax环境,故可使用$...$的格式来输出段落公式。

麦克斯韦方程组

HTML代码:

输出:

\[ \begin{align} \nabla \times \vec{\mathbf{B}}\, - \frac{1}{c}\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\[3pt] \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\[3pt] \nabla \times \vec{\mathbf{E}}\, + \frac{1}{c}\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\[3pt] \nabla \cdot \vec{\mathbf{B}} & = 0 \end{align} \]

解析:

  1. \nabla用于输出倒三角符号\(\nabla\),称为Nabla算子。相对应地,可使用\Delta来输出三角符号\(\Delta\)
  2. \times用于输出乘号\(\times\)
  3. \vec用于表示一个带有方向符号的矢量,如\(\vec{\mathbf{B}}\)
  4. \,命令用于插入一个较小宽度 (thin space) 的间距,宽度值约为\(\frac{3}{18}em\)。相对应地,\:命令用于插入一个值为\(\frac{4}{18}em\)的间距;\;命令用于插入一个值为\(\frac{5}{18}em\)的间距。
  5. align环境中,\\表示换行,而\\[3pt]表示换行后额外增加3 points的垂直间距。

参考资源

  1. tex-chtml.html (source codes)
  2. MathJax v4: TeX input, HTML output test

参考资源

MathJax

  1. mathjax.org
  2. Writing Mathematics for MathJax
  3. Github: MathJax Demos in Web Pages
  4. asciimath.org

Tex

  1. ctan.org
  2. LaTeX2e: An unofficial reference manual
  3. learnlatex.org