javascript - 使用 MathJax 向 DOM 添加元素？

Question

我正在尝试动态创建一个元素，然后对其进行一些处理。我试图在那个新创建的元素上使用 MathJax，但我无法在其上使用 MathJax.Hub.getAllJax。

我在控制台中输入了这个来测试:(MathOutput1 在 HTML 中定义)

MathJax.HTML.addElement(document.body, "div", {id: "blah"}, ['` `']);
<div id=​"blah">​` `​</div>​
MathJax.Hub.getAllJax("blah");
[]
MathJax.Hub.getAllJax("MathOutput1")
[Object]

有没有办法动态创建一个我可以操作的元素？

我确实确认 div 元素 blah 已添加到 dom(至少根据 chrome)“”

谢谢:)

Answer 1

这里的问题是 MathJax operates asynchronously ，并且您正在尝试在 MathJax.Hub 例程完全完成之前访问新元素。

要解决此问题，您可以将对 MathJax.Hub.getAllJax() 的调用放入 Hub 的回调队列<的回调函数中/em>:

function showBlahElement () {
    console.log(MathJax.Hub.getAllJax("blah"));
}

MathJax.HTML.addElement(document.body, "div", {id: "blah"}, ['$$a=b$$']);
MathJax.Hub.Queue(showBlahElement);

或者，您可以注册一个信号监听器，它将在特定事件发生时触发(在这种情况下，每当排版新数学时):

MathJax.Hub.Register.MessageHook("New Math", function (message) {
  console.log(MathJax.Hub.getAllJax("blah"));
});

MathJax.HTML.addElement(document.body, "div", {id: "blah"}, ['$$a=b$$']);

有关详细信息，请参阅 API docs .