Javascript / Prototype：获取css值，而不引用DOM元素？

Question

是否可以通过CSS文件中定义的类名（例如类的宽度）检索样式属性，而无需从DOM中的实际元素中获取它？

Answer 1

是。查看document.styleSheets属性。

https://developer.mozilla.org/en-US/docs/Web/API/document.styleSheets

http://www.quirksmode.org/dom/tests/stylesheets.html

Answer 2

确实可能，但更复杂 您可以访问具有document.styleSheets属性的样式表。

在每个样式表中，您必须访问包含该样式表中所有CSS规则的cssRules属性，以便在DOM中的第一个样式表中获取第一个规则

document.styleSheets[0].cssRules[0];

要查找某个元素，你必须解析样式表，这是在某些情况下变得复杂的地方，因为样式是继承的，但是如果寻找某个选择器和某种样式：

var rules = document.styleSheets[0].cssRules,
    theRule = null;

for (var i=0; i<rules.length; i++) {
     if (rules[i].selectorText.toLowerCase() == '#myelement') {
         var width = rules[i].style.width;
         break;
     }
}