即使在样式表中定义了字体大小，如何可靠地检索和更新 HTML 中的字体大小？

检索 HTML 中的字体大小

在 HTML 中，可以使用 CSS 指定元素的字体大小。通常，style.fontSize 属性用于设置或检索字体大小。但是，如果在样式表中定义了字体大小，则检索字体大小可能会很困难。

使用 style.fontSize

以下示例尝试检索然后更新字体使用 style.fontSize:

var x = document.getElementById("foo").style.fontSize;
document.getElementById("foo").style.fontSize = x + 1;

元素的大小，但是，如果font-size 在 CSS 样式表中外部定义。在这种情况下，style.fontSize 将返回空字符串，这可能会导致意外结果。

使用 window.getCompulatedStyle

要准确检索字体大小，甚至当它在样式表中定义时，请使用 window.getCompulatedStyle 方法。此方法计算元素的实际样式：

var el = document.getElementById('foo');
var style = window.getComputedStyle(el, null).getPropertyValue('font-size');
var fontSize = parseFloat(style); // Converts the retrieved value to a float
el.style.fontSize = (fontSize + 1) + 'px'; // Updates the font size

通过利用 window.getCompulatedStyle，您可以可靠地检索和更新元素的字体大小，无论它在样式表中如何定义。

以上是即使在样式表中定义了字体大小，如何可靠地检索和更新 HTML 中的字体大小？的详细内容。更多信息请关注PHP中文网其他相关文章！