[英]Uncaught DOMException: Failed to read the 'cssRules' property
I wonder why does my script work on firefox but not on google chrome我想知道为什么我的脚本可以在 Firefox 上运行,而不能在 google chrome 上运行
JS: JS:
var _timelineWidth = (Number.parseInt(document.styleSheets[0].cssRules[16].style.width) / 100) * document.body.clientWidth;
CSS: CSS:
#timeline {
position: relative;
top: 15px;
left: 12.5%;
height: 5px;
background: #aaa;
border-radius: 2.5px;
cursor: pointer;
}
here's the error code from chrome这是 chrome 的错误代码
Uncaught DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules
未捕获的 DOMException:无法从“CSSStyleSheet”读取“cssRules”属性:无法访问规则
In latest Chrome, CORS security rules are applicable for style-sheets also (Similar to Iframe rules).在最新的 Chrome 中, CORS安全规则也适用于样式表(类似于 Iframe 规则)。
You can load and render them but, cannot access the content through javascript (If loaded from Cross-Domain ).您可以加载和呈现它们,但无法通过 javascript 访问内容(如果从 Cross-Domain 加载)。
If your CSS Stylesheet is from Same domain as of HTML /or included in same HTML file, you will be able to access document.styleSheets[elem].cssRules
otherwise it will throw error如果您的 CSS 样式表来自与 HTML 相同的域/或包含在同一 HTML 文件中,您将能够访问
document.styleSheets[elem].cssRules
否则会抛出错误
Uncaught DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules
Cross Domain Stylesheet
跨域样式表
Same Domain Stylesheet
相同域样式表
You can add crossorigin="anonymous"
to prevent the error.您可以添加
crossorigin="anonymous"
以防止错误。
<link rel="stylesheet" href="https://..." crossorigin="anonymous">
More info here:更多信息在这里:
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin
This will create a potencial cors request but the server must respond with Access-Control-Allow-Origin: *
or Access-Control-Allow-Origin: <authorized-domain>
.这将创建一个潜在的 cors 请求,但服务器必须响应
Access-Control-Allow-Origin: *
或Access-Control-Allow-Origin: <authorized-domain>
。
You can check here to see how to add CORS support to your server.您可以在此处查看如何向您的服务器添加 CORS 支持。
For more information about CORS you can read this and this .有关 CORS 的更多信息,您可以阅读此和此。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.