首页 > 解决方案 > 如何使用 JavaScript 读取跨域 CSS 规则?

问题描述

我正在尝试document.styleSheets[i].cssRules在 JavaScript 控制台中使用来读取选项卡的加载 CSS 文件。但是,通常情况下,我会收到错误消息:CSSStyleSheet.cssRules getter: Not allowed to access cross-origin stylesheet.

我发现跨域 CSS 规则只能渲染,不能用 JavaScript 读取,可能是为了防止某些类型的 XSS 攻击。我试图通过使用Firefox 的CORS Everywhere扩展来绕过这个问题,我已经将它用于一些跨域 AJAX 请求,以便从 JS 控制台抓取数据,在那里它运行良好。但是,它不适用于阅读 CSS 规则。我也为 Chrome 尝试了一些类似的扩展,但我收到了类似的错误消息,并且扩展没有改变它。

有没有办法让浏览器让 JS 读取已加载选项卡中已加载的 CSS 规则?

如果我只是找到样式表的 URL 并尝试使用 AJAX 请求读取它们(我可以这样做),服务器可能会使用不同的文件进行响应。我有兴趣阅读已加载选项卡中已加载 HTML 的已加载 CSS 规则。

标签: javascriptcsscross-domain-policyweb-console

解决方案


推荐阅读