DOMParser注入DOM，但注入后不应用CSS样式表吗？ [英] DOMParser injects DOM but does not apply css stylesheets once injected?

问题描述

我在以下位置有一个测试用例：

I have a little testcase over at:

http://jsfiddle.net/9xwUx/1/

代码可归结为以下内容（给定一个ID为 target的节点）： / p>

The code boils down to the following (given a node with id "target"):

var string = '<div class="makeitpink">this should be pink, but is not</div>';
var parser = new DOMParser();
var domNode = parser.parseFromString(string,"text/xml");
document.getElementById("target").appendChild(domNode.firstChild);

如果您运行测试用例，然后通过firebug / chrome web inspector检查目标节点，然后选择jsfiddle的iframe的body标签中的节点，然后执行以HTML格式编辑，在任意位置添加随机字符作为字符串[不明确是domnode的属性]，然后应用保存样式。但在此之前。
要说我很困惑是一种轻描淡写。

If you run the testcase, and then inspect the target node via firebug/chrome web inspector and select any node within the body tag of jsfiddle's iframe, and do "edit as HTML", add a random charachter anywhere as a string [not an attribute to a domnode, to be clear], and "save", the style is applied. but not before that. To say that i'm confused is an understatement.

有人可以澄清一下这是怎么回事吗？
谢谢。

Can anybody please clarify what is going on here? Thanks.

推荐答案

您可以将mime类型更改为 text / html 并执行以下操作：

You can change the mime type to text/html and do the following:

var parser = new DOMParser()
var doc = parser.parseFromString(markup, 'text/html')
return doc.body.firstChild

我没有不会在所有浏览器上进行测试，但可以在Chrome和Firefox上运行。我看不出任何其他地方都无法使用的原因。

I didn't test on every browser but it works on Chrome and Firefox. I don't see any reason it wouldn't work elsewhere.

这篇关于DOMParser注入DOM，但注入后不应用CSS样式表吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！