我正在尝试解析网页(实际上是任何网页),并动态地对DOM元素的字体大小进行一些调整。
据我所知:
element.style.fontSize
将返回值加单位,例如:"11px"
或"1em"
或"1rem"
,对我来说很好,但是...element.style.fontSize
将不返回任何值。因此,如果我想处理所有DOM元素(其中大多数元素的style
属性中都没有定义其字体大小),则必须使用getComputedStyle代替,但...getComputedStyle
似乎返回所有以px为单位的字体大小,即使它最初是在CSS中的em或rem中定义的,例如:定义为"1rem"
的字体大小=> getComputedStyle
会返回"16px"
。出于我的目的,我想知道原始字体大小值及其原始单位,因此请获取"1rem"
而不是"16px"
。有可能吗?
如果您尝试动态调整字体大小,则可以使用.style.fontSize
。这是由于以下事实:内联样式具有更高的特异性,因此您所做的更改将覆盖样式表中可能存在的所有样式。
.getComputedStyle()
返回CSS值之后“在应用活动样式表并解决这些值可能包含的所有基本计算之后”。这意味着.getComputedStyle()
被考虑并相应调整。话虽如此,如果您需要基于样式表中设置的现有值进行定位,我认为rem
是最好的选择。它显示了计算出的值这一事实不应该改变。您仍然可以在转换后进行“更改”操作-甚至可以根据需要转换回去。
无论哪种方式,您都需要使用.getComputedStyle()
set属性。