Question

有没有办法用JavaScript选择元素的所有CSS规则？只要读取给定元素的所有CSS规则，我就不会寻找特定的解决方案。

所以，我有以下HTML

<div class='styledDiv' style='height:100px;width:100px;'></div>

然后在一个单独的CSS文件中：

.styledDiv
{
  background-color: #ccc;
  border: solid 5px blue;
}

我希望最终结果包含所有内联和单独的文件CSS规则。最终结果的格式无关紧要，无论是字符串还是数组，无论如何。

我还要提一下，我查看了一些从单独的CSS文件中读取CSS规则的代码。我认为可能有更好的解决方案。此外，FireFox和Chrome允许循环遍历.style属性，就像循环遍历数组一样。但是，FF吐出 - 右边界和左边界/边距/填充的* tl-source规则，并没有显示实际的CSS值。涉及jQuery的解决方案也没问题。

Answer 1

对于FireFox，您可以使用：https://developer.mozilla.org/en/DOM:window.getComputedStyle

对于IE，你可以使用这个： http://msdn.microsoft.com/en-us/library/ms535231(VS.85).aspx

请注意！你正在这里的黑暗水域跋涉。

这些结果返回浏览器对CSS的解释。例如，获取颜色时，IE将返回 HEX颜色代码，而Firefox返回 rbg代码。对于字体大小，IE将返回实际的继承的字体大小，而Firefox将返回 pt 。

Answer 2

我认为此链接可能会帮助您：

http://developer.apple.com/internet/webcontent/styles.html

使用JavaScript获取元素的所有CSS样式

2 个答案: