如何使用JavaScript获取元素的实际继承CSS？

Question

使用JavaScript，如何获取继承的CSS属性的实际值？

例如，请考虑以下HTML：

<p><span style="font-size:24pt;">Test #1</span></p>​
<p style="font-size:24pt;">Test <span style="font-weight:bold;">#2</span></p>​

使用jQuery代码$('p span').css('fontSize')将产生32px而非24pt，因为它使用getComputedStyle返回使用的值，而不是实际继承值。但有时风格将直接在我所定位的元素上，有时它会被继承。

Here is a test case。如何使用JavaScript获取实际继承的元素CSS？

Answer 1

@mikerobi的答案将满足您的测试用例，但更具体的是，浏览器公开的唯一CSS属性来自getComputedStyle，所以如果它错了，那就差不多了。有关详细信息，请参阅其他问题的this answer。