如何在 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中文網其他相關文章！