Comment accéder aux variables CSS à l'aide de JavaScript ?

Comment accéder aux variables CSS en JavaScript

L'accès aux variables CSS à partir de JavaScript vous permet de manipuler dynamiquement le style de votre application Web. Voici comment y parvenir :

Étape 1 : Obtenir les styles calculés

Utilisez la fonction getComputedStyle pour récupérer les styles calculés de l'élément cible.

Étape 2 : Obtenir la valeur de la propriété

Utiliser le Méthode getPropertyValue pour récupérer la valeur de la variable CSS souhaitée.

Syntaxe :

getComputedStyle(element).getPropertyValue('--variable-name');

Exemple :

À récupérer la valeur de la variable CSS --color-font-general déclarée dans le code fourni extrait :

var style = getComputedStyle(document.body);
var color = style.getPropertyValue('--color-font-general');

Ce code capturera la valeur de la variable CSS et la stockera dans la variable color.

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!