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

How can I get the actual inherited CSS of an element using JavaScript?

本文关键字：继承 CSS 元素何使用 JavaScript 更新时间：2023-09-26

使用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返回使用的值，而不是实际继承的值。但有时风格会直接针对我所针对的元素，有时它会被继承。

这是一个测试用例。如何使用JavaScript获得元素的实际继承CSS？

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