如何在 JavaScript 中获取 DOM 元素的计算字体大小？

使用 JavaScript 获取 DOM 元素中的计算字体大小

考虑继承和全局设置，确定应用于 DOM 元素的实际字体大小，可能是 Web 开发中的常见任务。这在使用需要准确字体大小信息的插件或自动化任务时特别有用。

计算字体大小检测的通用方法

实现与框架无关的字体​​大小检索，您可以利用以下内容方法：

function getStyle(el, styleProp) {
  // Convert property name to camelCase for IE compatibility
  let camelize = (str) => str.replace(/\-(\w)/g, s => s[1].toUpperCase());

  // Attempt IE's non-standard currentStyle
  if (el.currentStyle) {
    return el.currentStyle[camelize(styleProp)];
  }
  // Try DOM Level 2 getComputedStyle if available
  else if (document.defaultView && document.defaultView.getComputedStyle) {
    return document.defaultView.getComputedStyle(el, null).getPropertyValue(styleProp);
  }
  // Fallback to inline style
  else {
    return el.style[camelize(styleProp)];
  }
}

用法：

const element = document.getElementById('elementId');
const fontSize = getStyle(element, 'font-size');

通过使用此方法，您可以获得任何 DOM 元素的计算字体大小，无论其继承或全局设置。

以上是如何在 JavaScript 中获取 DOM 元素的计算字体大小？的详细内容。更多信息请关注PHP中文网其他相关文章！