Question

我正在尝试使用javascript

将一些样式添加到页面中

var style = document.createElement("style"),
style.innerHTML = ".firstChildTest div:first-child {width: 2px;}";

但是ie6-8在尝试在样式元素上使用innerHTML时会抛出错误。我也使用

得到了同样的错误

 style.append(document.createTextNode(".firstChildTest div:first-child {width: 2px;}"));

如何将样式注入ie？

中的样式元素

Answer 1

请在此处查看答案：How do you copy an inline style element in IE?

function copy_style(style_text) {    
    var tmp_div = document.createElement('div');
    tmp_div.innerHTML = '<p>x</p><style type="text/css">' + style_text + '</style>';

    return tmp_div.getElementsByTagName('style')[0];
}

请注意，您需要tmp_div的innerHTML中的<p>标记。没有它，IE不接受样式元素。

Answer 2

＃9之前的IE无法使用childNodes将文本添加到样式（或脚本或选项）元素中，并且样式应该在html文档的头部。

function addStyle(str){
    var el= document.createElement('style');
    if(el.styleSheet) el.styleSheet.cssText= str;
    else{
        el.appendChild(document.createTextNode(str));
    }
    return document.getElementsByTagName('head')[0].appendChild(el);
}

将样式标记添加到页面

2 个答案: