使用JS动态添加矩阵时MathJax无法正常渲染，求排查错误

别担心，刚接触MathJax遇到这种问题太正常了，都是JS字符串转义的小坑😉

你的代码里有两个关键问题，直接导致MathJax无法正确识别矩阵语法：

1. JS字符串中的反斜杠未转义 #

在JavaScript的字符串中，单个反斜杠\是转义字符，它会被JS引擎解析成其他含义，而不是直接作为文本传递给MathJax。比如你写的\begin{bmatrix}，JS会把\b当成特殊转义序列（这里会被解析成无效转义，最终变成begin{bmatrix}），MathJax自然识别不了begin这个命令。

要在JS字符串中表示一个实际的\，必须写成双反斜杠\\。

2. 错误使用了HTML实体& #

你代码里的&是HTML中的实体编码，用来表示&字符，但在JS直接设置innerHTML时，不需要这样转义——直接写&就可以了。如果用&，MathJax会把它当成普通的文本&，而不是矩阵列分隔符&，这也会导致渲染失败。

把这两个问题修复后，代码应该是这样的：

function displayTransformationMatrix() {
  var vx = 10, vy = 20, vz = 30; // 示例变量值，替换成你的实际变量
  // 用ES6模板字符串拼接变量更简洁，所有\改成\\，矩阵行分隔的\\写成\\\\（JS转义后得到MathJax需要的\\）
  var matrix = `$$\\begin{bmatrix} 1 & 0 & 0 & ${vx} \\\\ 0 & 1 & 0 & ${vy} \\\\ 0 & 0 & 1 & ${vz} \\\\ 0 & 0 & 0 & 1 \\end{bmatrix}$$`;
  var tranMat = document.getElementById("transformMatrix");
  tranMat.innerHTML = matrix;
  MathJax.Hub.Queue(["Typeset", MathJax.Hub, 'transformMatrix']);
}

如果你的环境不支持ES6模板字符串，也可以用普通字符串拼接：

var matrix = "$$\\begin{bmatrix} 1 & 0 & 0 & " + vx + " \\\\ 0 & 1 & 0 & " + vy + " \\\\ 0 & 0 & 1 & " + vz + " \\\\ 0 & 0 & 0 & 1 \\end{bmatrix}$$";

如果你的MathJax是v3及以上的新版本，MathJax.Hub已经被废弃了，建议改用更简洁的写法：

MathJax.typeset([tranMat]);

不过如果你的项目还在使用v2版本，原来的Queue写法完全没问题。

内容的提问来源于stack exchange，提问作者Shantanu Shinde