CSS 规则对象答案

【问题标题】：The CSS Rule objectCSS 规则对象
【发布时间】：2012-05-17 18:04:21
【问题描述】：

根据该站点externalcss3，styleSheet 对象的 CSS Rule 对象允许您访问样式表的各个规则。

所以如果我尝试在 stackoverflow 页面上运行这段代码（*），使用 javascript 控制台，我希望看到一些 CSS 规则写在这个页面http://cdn.sstatic.net/stackoverflow/all.css?v=04e0337352b3。

(*)

var mysheet=document.styleSheets[0]
var myrules=mysheet.cssRules? mysheet.cssRules: mysheet.rules
for (i=0; i<myrules.length; i++) {
     console.log(myrules[i].selectorText.toLowerCase());
}

其实console.log的结果和我想象的不一样：

object[type="application/x-shockwave-flash"], object[type="application/futuresplash"], object[data*=".swf"], object[src*=".swf"], embed[type="application/x-shockwave-flash"], embed[type="application/futuresplash"], embed[src*=".swf"]

我错过了什么？对不起我的无知和你的时间。

【问题讨论】：

其实我发现只有样式表（0）里面没有规则。还是很奇怪。
（或者 Firefox 中的安全错误 - 甚至更奇怪！）
我敢打赌，您看到的样式表是由浏览器扩展程序注入的……可能是 adblock 之类的（除了 adblock 将样式表放在最后，所以必须是其他东西）。

标签： javascript css

【解决方案1】：

您似乎只能访问来自同一域的 CSS 文件中的规则。

阅读此主题：Reading the rules of a cross domain CSS file in DOM

【讨论】：

绝对正确，虽然我很好奇为什么 OP 可以读取任何规则。
@apsillers - 我不知道。我正确地得到了一个 TypeError：Cannot read property 'length' of null.