Dostęp do zmiennej CSS z javascript

Question

Czy istnieje sposób dostępu do zmiennej css z javascript? Tutaj moja deklaracja zmiennej css.

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

Answer 1

Wystarczy standardowy sposób:

1. Get Wyliczony style z getComputedStyle
2. użytkowania getPropertyValue aby uzyskać wartość żądanej własności

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

Przykład:

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

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

Answer 2

Użyj tego:

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

I można ją zmienić tak:

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

source