Il n'y a pas de réponse unique à cette question car les deux langages abordent l'affectation et la manipulation de variables de différentes manières. D'une manière générale, cependant, un problème avec la modification d'une variable CSS avec JavaScript est que les deux langages utilisent des syntaxes différentes pour déclarer et accéder aux variables. De plus, les variables CSS sont généralement définies au niveau de la feuille de style plutôt qu'au niveau de l'élément individuel, ce qui peut les rendre difficiles d'accès depuis le code JavaScript.
var element = document.getElementById("element");
element.style.setProperty("--variable", "new-value");
Cette ligne de code définit une nouvelle valeur pour une variable CSS. La première ligne obtient l'élément avec l'ID "element". La deuxième ligne définit la valeur de la variable CSS "–variable" sur "new-value".
Variables CSS
Les variables CSS sont un excellent moyen de stocker des données dans vos fichiers CSS sans avoir à utiliser de variables globales. Vous pouvez les utiliser pour stocker des informations telles que la largeur ou la hauteur de la page actuelle ou la taille de police actuelle.
Pour utiliser une variable CSS dans votre code JavaScript, vous devez d'abord inclure la propriété css dans la feuille de style de votre document. Ensuite, vous pouvez définir la variable à l'aide du mot-clé var :
var largeur = document.getElementById("myElement").offsetWidth ;
Vous pouvez également utiliser la propriété css pour accéder aux valeurs individuelles d'une variable :
var largeur = document.getElementById("myElement").offsetWidth ; var hauteur = document.getElementById(“myElement”).offsetHeight;
Contrôle CSS
En JavaScript, il existe plusieurs façons de contrôler CSS. Une façon consiste à utiliser la propriété css. Cette propriété vous permet de définir le style d'un élément spécifique dans votre document.
Une autre façon de contrôler CSS consiste à utiliser la propriété style. Cette propriété vous permet de définir le style de tous les éléments de votre document.
