Javascript currentStyle与getComputedStyle的Firefox问题

我试图根据CSS规则获取元素的宽度问题是“getComputedStyle”返回一个像素值，而不是没有设置CSS宽度值的元素的“auto”。在Opera中，“elem.currentStyle['width']”返回“auto”，但在firefox中，它必须使用“getComputedStyle”，它返回类似“1149px”的内容

对我来说，了解CSS的实际规则是至关重要的。除了getComputedStyle之外，还有其他方法吗？明确表示“getComputedStyle”不是一个好办法，但我找不到任何与“currentStyle”相当的Firefox文档

如果您想知道，我的最终目标是找到页面上最大的静态宽度元素。 如果我无法读取样式表值-仅读取渲染/计算值-

---

那我怎样才能做到呢

如果您只想获取元素的维度，为什么不使用

element.clientWidth

或

element.clientHeight

getcomputestyle不是为检索元素的宽度或高度而设计的，不幸的是，据我所知，没有切实可行的方法来实现这一点

编辑：上面的答案在样式表中循环是你最好的选择。我最初想访问样式表，但没有想到使用querySelectorAll。向瓦拉迪米尔致敬，寻求一个天才的解决方案

--

我能想到的唯一解决方案是，对于要设置宽度的元素，还可以将其他一些不常用的样式设置为不会真正影响任何内容的样式，这样您就可以进行测试了

div {
    width: 35px;
    min-width: 1px; /* the flag */
    }

因此，在查找具有指定宽度的元素时，可以先查找[ComputedStyle].minWidth=='1px'

这是一个相当老套的解决方案，但它能完成任务

---

您还可以为具有设置宽度的元素设置一个随机类名，然后只需查询具有该类名的元素。虽然这不是一个非常动态的解决方案。

如果从元素开始，就无法知道应用了哪些样式表规则

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
    }
  }
}

for（var i=0；i

如果随后需要查找与该规则匹配的元素，则可以与

规则一起使用。选择OrText

。剩下的问题是，多个样式规则可能应用于同一个元素，需要计算规则的特殊性。不知道这对你来说是个多大的问题

其他文件：

---

OP希望找到一个元素是否定义了宽度，而不仅仅是计算的宽度。我希望避免在样式表中循环，因为从性能的角度来看，这可能会很麻烦，但我想凭直觉我可以做到这一点。您知道一种通过类名快速查找css规则（不使用jquery）的方法吗，而不必在样式表中循环查找“className='whatever'？比如，有“document.getCSSRuleByClass（）”之类的东西吗？没有，我不认为有这样的东西。这是个好主意，但绝对是黑客的。我认为Wladimir关于在样式表中循环的建议更干净一些