如何在 JavaScript 中取得真實的字體家族名稱？

在 JavaScript 中取得真實字體系列值

在上一個問題中討論如何透過 JavaScript 取得字體大小。現在，我們將探討如何從 DOM 元素的計算樣式中確定實際的字體系列名稱。

預設情況下，計算樣式函數僅傳回整個字體定義，包括完整的字體系列堆疊。但是，為了在下拉式選單中選擇字體，我們需要所使用字體的確切名稱。

解決方案

要提取真實的字體系列名稱，使用以下代碼：

let para = document.querySelector('p');
let compStyles = window.getComputedStyle(para);
let computedFontFamily = compStyles.getPropertyValue('font-family');

這將傳回一個類似「Times New Roman ”的字串，它可以與字體系列下拉列表中的選項進行匹配。

瀏覽器支援

所有主流瀏覽器都支援上述程式碼，提供一致的方式來取得計算的字體系列值。

以上是如何在 JavaScript 中取得真實的字體家族名稱？的詳細內容。更多資訊請關注PHP中文網其他相關文章！