如何使用Javascript解析@import样式表

Question

我试图在我的样式表中使用document.styleSheets数组读取CSS选择器.它<link>和<style>标签一起工作正常,但是当我@import在里面使用时,<style>它不会出现在数组中 - 仅作为cssRule(在Safari 3和FF 3中样式为"Undefined").

那么:我如何在@imported文件中解析css？

Answer 1

假设我们的文档在第一个样式表中包含@ import-rule作为第一个规则,这里是符合标准的浏览器的代码

document.styleSheets[0].cssRules[0].styleSheet.cssRules;

和我们所有心爱的IE的特例

document.styleSheets[0].imports[0].rules;

如果您已经阅读了我已经链接到的quirksmode.org的页面,然后@import用for..in循环遍历-rule 的属性,那么你可以很容易地想出这个- 这就是我做的...

PS:我还不能对其他答案发表评论,但如果可以的话,我会适当地嘲笑你;)