在IE7 +的动态样式表中添加@import语句

Question

我在使用@import语句为IE添加动态样式元素时遇到问题。试试这个：

var string = '@import url(test.css)';
var style = document.createElement('style');

if (style.styleSheet) { // IE
    style.styleSheet.cssText = string;
} else {
    var cssText = document.createTextNode(string);
    style.appendChild(cssText);
}

document.getElementsByTagName('head')[0].appendChild(style);

这适用于FF / Chrome但不适用于IE。它似乎识别style.styleSheets.imports，但它不会应用导入的样式表。这是一个错误还是限制？

Answer 1

许多旧的浏览器无法处理不同形式的@import指令，这可用于隐藏它们的css。查看http://www.w3development.de/css/hide_css_from_browsers/import/了解详情。

@import指令必须首先出现在样式表中，否则它们将被忽略。但IE不会忽略错位的@import指令。

修改：有关IE中的注入样式表，请参阅addImport method。