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