先看个例子:
<html style="font-size: 10px;">
<head>
<style>
.p {
width:20rem;
}
</style>
</head>
<body>
<p style="width:10rem"></p>
<p style="width:10px"></p>
<p class="p"></p>
</body>
</html>
我查阅了相关的资料,
类似window.getComputedStyle(element,伪类)
的方法只能获取到计算后的样式值,即以上p
元素的宽度依次为:100px
、10px
、200px
而类似element.style
的方法可以获取计算前的样式值,但只能获取内联样式
那么有没有这样的方法,可以获取元素最终使用、但未经计算的值呢?
即以上代码获取p
元素的宽度依次为:10rem
、10px
、20rem
就像chrome
的devtools
,里边的Styles
面板,始终会显示没有计算过的属性值。
需要从 styleSheets 去分析,处理起来有点复杂,给你个参数
参考:https://stackoverflow.com/que...
这个参考是通过对比 selector 来实现的,如果借助 jQuery,可以实现对 Element 的匹配
$(el).is(selector)