Question

我正在尝试创建然后设置文档片段的样式，但是我遇到了很多困难。具有讽刺意味的是，IE不是我的问题！

我有这个：

var newDom = document.createDocumentFragment();

newDom.appendChild(document.createElement("style"));
newDom.appendChild(document.createElement("div"));

if (newDom.childNodes[0].styleSheet){
    newDom.childNodes[0].styleSheet.cssText = "div{color:red;}";
    alert(newDom.childNodes[1].currentStyle.color);
}else{
    newDom.childNodes[0].appendChild(document.createTextNode("div{color:red;}"));
    alert(window.getComputedStyle(newDom.childNodes[1], null).color);
};

...在IE7 / 8/9中警告“红色”，但在FF3.0 / 4/10中警告“rgb（0,0,0）”。并且，是的，我需要知道应用了哪些样式，所以我需要从FF中读取getComputedStyle（或者使用其他方法，只要它可靠）。

我做错了什么？这可能吗？（我想/希望如此......）

我尝试过很多东西 - 比如“newDom.styleSheets”，它存在于IE但不是FF中 - 无济于事。

请帮忙 - 谢谢！：d

Answer 1

在网上阅读，似乎使用Javascript更改CSS的正确语法是：

obj.style.cssText = 'something';

无论如何，这似乎并没有解决问题。我建议你阅读这篇文章，这可能会对你有所帮助：http://www.phpied.com/the-new-game-show-will-it-reflow/。

我还建议更改方法并将CSS代码放在预先存在的CSS样式表中，与类似.red-color的类相关联，然后只将类添加到新创建的div中，{{1 }}。另一种方法是将样式设置为内联，始终使用相同的函数：setAttribute('class', 'red-color')。

如何在IE / FF中的文档片段中添加CSS规则？

1 个答案: