Comment obtenir le vrai nom de famille de polices en JavaScript ?

Obtenir la vraie valeur de la famille de polices en JavaScript

Dans une question précédente, il a été expliqué comment obtenir la taille de la police via JavaScript. Nous allons maintenant explorer comment déterminer le nom réel de la famille de polices à partir du style calculé d'un élément DOM.

Par défaut, la fonction de style calculé renvoie uniquement la définition complète de la police, y compris la pile complète de la famille de polices. Cependant, pour sélectionner les polices dans un menu déroulant, nous avons besoin du nom exact de la police utilisée.

Solution

Pour extraire le vrai nom de la famille de polices, utilisez le code suivant :

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

Cela renverra une chaîne telle que "Times New Roman", qui pourra être comparée aux options de la liste déroulante de votre famille de polices.

Prise en charge du navigateur

Le code ci-dessus est pris en charge dans tous les principaux navigateurs, offrant un moyen cohérent d'obtenir la valeur calculée de la famille de polices.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!