L'accès CSS variable de javascript

Question

Est-il un moyen d'accéder à une feuille css variable de javascript? Voici mon css déclaration de variable.

:root{
    --color-font-general:#336699;
}

Answer 1

Juste la manière standard:

1. Obtenir de l'aide de styles avec des getComputedStyle
2. Utiliser getPropertyValue pour obtenir la valeur de la propriété désirée

getComputedStyle(element).getPropertyValue('--color-font-general');

Exemple:

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

:root { --color-font-general: #336699; }

Answer 2

Utilisez ceci:

window.getComputedStyle(document.documentElement).getPropertyValue('--color-font-general');

Et vous pouvez le modifier comme ceci:

document.documentElement.style.setProperty('--color-font-general', '#000');

source