javascript - Firefox的currentStyle与getComputedStyle问题

我正在尝试根据CSS规则获取元素的宽度问题是对于没有设置CSS宽度值的元素，“getComputedStyle”返回的是像素值而不是“auto”。在Opera中，“elem.currentStyle ['width']”返回“自动”，但在Firefox中，它必须使用“getComputedStyle”，该返回值类似于“1149px”。

对我来说至关重要的是要知道实际的CSS规则是什么。除了getComputedStyle之外，还有其他方法吗？ The Firefox MDN清楚地表明，“getComputedStyle”不是可行的方法，但是我找不到与“currentStyle”等效的Firefox文档。

如果您想知道，我的最终目标是在页面上找到最大的static-width元素。
如果我无法读取样式表值-仅显示/计算值-
那我该如何实现呢？

最佳答案

如果从元素开始，则无法知道对其应用了哪些样式表规则。 getComputedStyle()仅仅为您提供了有效的样式值，并且currentStyle并没有太大不同，即使碰巧能够为您提供在特定场景和特定浏览器中所期望的结果。

您可能需要做的是浏览样式表。遵循以下原则:

for (var i = 0; i < document.styleSheets.length; i++)
{
  var styleSheet = document.styleSheets[i];
  for (var j = 0; j < styleSheet.cssRules.length; j++)
  {
    var rule = styleSheet.cssRules[j];
    if (rule.type == 1)  // STYLE_RULE
    {
      // Do something with rule.style.width
    }
  }
}

如果随后需要查找与该规则匹配的元素，则可以将 document.querySelectorAll() 与rule.selectorText一起使用。剩下的问题是，多个样式规则可能适用于同一元素，并且需要计算规则的特异性。不知道这对您有多大的问题。

附加文档:

CSSStyleSheet

CSSStyleRule

关于javascript - Firefox的currentStyle与getComputedStyle问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7226162/