JavaScript 可以访问无效的自定义 CSS 属性的值吗？

从 JavaScript 访问无效的自定义 CSS 属性

在 CSS 中，可以使用 -- 前缀定义自定义属性。但是，您可以从 JavaScript 访问无效或自定义 CSS 属性的值吗？

问题：

给定以下 CSS：

<code class="css">div {
    -my-foo: 42;
}</code>

您稍后可以在 JavaScript 中确定特定 div 元素的 -my-foo 属性的值吗？

答案：

在 CSSStyleDeclaration 中访问无效属性名称不会Chrome 和 Firefox 等流行浏览器似乎都支持。对于给定的 CSS，CSSStyleDeclaration 对象仅包含有效的属性宽度并跳过 -my-foo。

有趣的是，DOM-Level-2 样式规范规定所有指定的属性都应通过 CSSStyleDeclaration 接口可用。可能有一些浏览器支持此行为。

DIY 方法：

作为解决方法，您可以使用 document.getElementsByTagName("style" 解析原始 CSS 文本)[0].innerText。然而，这可能是一种麻烦的方法。

以上是JavaScript 可以访问无效的自定义 CSS 属性的值吗？的详细内容。更多信息请关注PHP中文网其他相关文章！