如何强制浏览器再次解析 MathML 内容？答案

【问题标题】：How to force the browser to parse the MathML content again?如何强制浏览器再次解析 MathML 内容？
【发布时间】：2013-05-13 13:03:25
【问题描述】：

具体来说（MathJax 不是我要找的）我有一个网页，里面有一些 MathML。“FireFox”浏览器可以很好地解析它，但是当我尝试通过 javascript 添加相同的代码时，它没有'不解析它。如何通知浏览器再次解析网页的内容？即使它是javascript以外的其他语言这是javascript代码：

    var b=document.createElement("math");
    b.setAttribute("xmlns","http://www.w3.org/1998/Math/MathML");
    var msup=document.createElement("msup");
    var c=document.createElement("mi");
    c.innerHTML="c";
    var p=document.createElement("mn");
    p.innerHTML="6";
    msup.appendChild(c);
    msup.appendChild(p);
    b.appendChild(msup);
    document.body.appendChild(b);

这是它生成的 HTML

    <math xmlns="http://www.w3.org/1998/Math/MathML">
    <msup>
    <mi>c</mi>
    <mn>6</mn>
    </msup>
    </math>

【问题讨论】：

标签： javascript parsing dynamic browser mathml

【解决方案1】：

您需要使用document.createElementNS() 而不是document.createElement() 才能在正确的命名空间中创建元素。事后设置xmlns 属性实际上并没有这样做。所以这是一个适合我的例子

<!DOCTYPE html>
<html>
<head>
<title>Test adding MathML</title>
</head>
<body>
<script>
var MML = "http://www.w3.org/1998/Math/MathML";
var b=document.createElementNS(MML,"math");
var msup=document.createElementNS(MML,"msup");
var c=document.createElementNS(MML,"mi");
c.appendChild(document.createTextNode("c"));
var p=document.createElementNS(MML,"mn");
p.appendChild(document.createTextNode("6"));
msup.appendChild(c);
msup.appendChild(p);
b.appendChild(msup);
document.body.appendChild(b);
</script>
</body>
</html>

我还将您对innerHTML 的使用切换为使用document.createTextNode()，以与您创建其他节点的方式保持一致。

【讨论】：

【解决方案2】：

我可以通过设置 div 元素的 innerHTML 来强制重建：

myDiv.innerHTML = b.outerHTML;

Demonstration（点击“在 JS 上运行”）

当然是it works only on some browsers。

【讨论】：