Javascript Firefox - 如果样式表错误或预期行为中存在@import,则无法查询cssRules?

P K*_*P K 6 javascript css browser firefox

如果css样式表中存在@import,我无法查询cssRules.它是否符合网络标准?或者知道Firefox的局限性?

注意:我从同一个域导入css文件.

var style_rules = document.styleSheets[0].cssRules;
console.log(style_rules);
Run Code Online (Sandbox Code Playgroud)

底层对象不支持参数或操作[Break On This Error] var style_rules = document.styleSheets [0] .cssRules;

Fri*_*ann 0

似乎工作正常,尽管我只使用不存在的文件进行了测试。 在 Firefox 8 上运行的 jsfiddle 示例

更新1:我想我找到了你遇到问题的原因。如果 cssRule 是导入的,则必须解析其 StyleSheet 属性的 cssRules。使用 Firefox 的 Firebug Addon 很容易发现这一点。

这是测试.html

<html>
<head>
<style type="text/css">
@import 'test.css';
</style>
</head>
<body>
<div class="random5923">showing with border</div>
<script type="text/javascript">
console.log(document.styleSheets);
console.log(document.styleSheets[0].cssRules[0].styleSheet.cssRules[0].cssText);
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

以及相应的test.css

.random5923 {
    border : 1px solid black;
}
Run Code Online (Sandbox Code Playgroud)

更新2:根据http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSImportRule CSSImportRule 对象明确具有 styleSheet 属性。请使用我的示例来亲自检查这一点,但请记住这一点:

如果样式表尚未加载,则该属性值为 null

您可能希望延迟代码,直到加载此属性。