Question

因此，基本上我尝试做的是使用Chrome扩展程序来正确呈现MathML表达式（我已经尝试了＃34; MathJax for Chrome＆＃34;扩展程序，但它没有＆＃39 ;为我工作）。

我最初的计划是在head节点中添加一个指向MathJax代码的链接，但这不起作用（我假设因为它在 >页面已加载。）

我目前的计划是用引用MathJax代码的iframe替换每个MathML对象，并且只包含原始的MathML对象。由于iframe的HTML基于原始MathML元素，因此我使用srcdoc属性。这是我目前的剧本：

$(document).ready(function() {
    $("math").each(function(index, obj) {
        // create an inline frame to replace the math element
        var iframe = document.createElement("iframe");
        var html = '<html><head><script type="text/javascript" src="https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script></head>';
        html += '<body>';
        // http://stackoverflow.com/questions/2419749/get-selected-elements-outer-html
        html += $(obj).clone().wrap('<p>').parent().html();
        html += '</body></html>';
        $(iframe).attr("srcdoc", html);
        iframe.textContent = "FOO";
        $(obj).replaceWith(iframe);
    });
});

这适用于非XHTML页面，例如Mozilla的MathML＆＃34;酷刑测试＆＃34;，但对于XHTML（甚至是Transitional），我只得到"FOO"文本。

我需要做些什么来让iframe为XHTML Transitional工作吗？或者有更好的方法来实现我想要的目标吗？

Answer 1

问题在于：

srcdoc已添加到iframe元素中，作为HTML5的一部分，由HTML5 doctype触发
XHTML Transitional不使用HTML5 doctype

使用编码的data: URI加object元素来向后兼容，如下所示：

var newobj = $("<object/>", {"text":"FOO"});
var html = "<html><head></head><body><p>XHTML is the best</p></body></html>"
var xhtml = encodeURIComponent(html);
newobj.appendTo("body");
/* Add attribute values after appending to the DOM */
$(newobj).attr({data:'data:text/html;charset=utf-8;,'+xhtml, type:"text/html"})

<强>参考

XHTML Transitional中的iframe不起作用

1 个答案: