javascript - 在javascript中跨域访问css文件中的CSS类

Question

我们通过标准的 HTML STYLE 标签包含 CSS 文件。

然后我们需要 javascript 代码来访问 CSS 类和属性。在 IE 和 Chrome 中一切正常，但在 Firefox 中它抛出这个异常:

未捕获的异常:安全错误(NS ERROR DOM SECURITY ERR)

这是javascript代码:

for (var i = 0; i != window.document.styleSheets.length; i++) {
    rules = window.document.styleSheets.item(i);
    if(rules.href.indexOf('someurl.com')){
        break;
    }
}
return rules.cssRules || rules.rules;

它在 IE、Chrome 和 Safari 中运行良好，但在 Firefox 和 Opera 中运行不正常。

有什么想法吗？提前致谢

Answer 1

JavaScript 可以从任何域引用，但只能对执行它的文档的确切域进行更改。我所说的确切域是指从协议(protocol)到第一个目录之前的所有内容都必须相同。

您不应该能够使用 JavaScript 访问不同的域。我不确定为什么这在 IE 或 Chrome 中有效，但它不应该。如果 CSS 来自与执行 JavaScript 的页面不同的域，您将被抛出安全错误。

这里真正的问题是:item 是什么属性？我没有看到您的代码中定义了它，而且我以前也没有看到它被使用过。为什么要尝试使用 JavaScript 更改样式表，而不是简单地将样式更改直接应用于不会引发安全问题的 DOM？