获取尚未应用的类的 CSS 属性值

在 jQuery 中，我可以使用以下方法获取选择器的 CSS 属性值css方法并传递属性名称，例如：

$('#myElement').css('backgroundImage');

我的问题是，如何从一个类中获取 css 属性值not尚未应用于any元素？如同$('.myClass').css('backgroundImage');其中选择器返回零个元素，但有该类的 CSS 声明。

您可以创建临时元素而不将其添加到 DOM，并检查相关属性。即使元素未添加到 DOM，CSS 也会应用。例如。

CSS

p { color: red; }

JS

var p = document.createElement('p');
alert(window.getComputedStyle(p, null).getPropertyValue('color'));

会给你颜色值，但不会向 DOM 添加任何内容。

WARNING

经过一番研究，我确定此方法仅适用于基于 Gecko 的浏览器，因此不适合通用用途。这个情况未来可能会改变，但如果您今天想要一个跨浏览器解决方案，我不会依赖它。

鉴于此，我建议您创建一个临时元素，添加所需的类，将其添加到文档中，检查它以获取样式值，然后将其删除。您还可以应用诸如display: none以防止在它作为文档的一部分的极其短暂的时间内向用户显示它。