Ne postoji jedinstven odgovor na ovo pitanje jer dva jezika pristupaju dodjeli varijabli i manipulaciji na različite načine. Uopšteno govoreći, međutim, jedan problem sa pokušajem da se promeni CSS varijabla sa JavaScript-om je da dva jezika koriste različite sintakse za deklarisanje i pristup varijablama. Pored toga, CSS varijable se obično definišu na nivou lista stilova, a ne na nivou pojedinačnog elementa, što im može otežati pristup iz JavaScript koda.
var element = document.getElementById("element");
element.style.setProperty("--variable", "new-value");
Ova linija koda postavlja novu vrijednost za CSS varijablu. Prvi red dobiva element s ID-om “element”. Drugi red postavlja vrijednost CSS varijable “–varijable” na “new-value”.
CSS varijable
CSS varijable su odličan način za pohranjivanje podataka u vašim CSS datotekama bez potrebe za korištenjem globalnih varijabli. Možete ih koristiti za pohranjivanje informacija kao što su širina ili visina trenutne stranice ili trenutna veličina fonta.
Da biste koristili CSS varijablu u svom JavaScript kodu, prvo morate uključiti css svojstvo u stilski list vašeg dokumenta. Zatim možete definirati varijablu koristeći ključnu riječ var:
var width = document.getElementById(“myElement”).offsetWidth;
Također možete koristiti svojstvo css za pristup pojedinačnim vrijednostima iz varijable:
var width = document.getElementById(“myElement”).offsetWidth; var visina = document.getElementById(“myElement”).offsetHeight;
Kontrolirajte CSS
U JavaScript-u postoji nekoliko načina za kontrolu CSS-a. Jedan od načina je korištenje svojstva css. Ovo svojstvo vam omogućava da postavite stil za određeni element u vašem dokumentu.
Drugi način kontrole CSS-a je korištenje svojstva style. Ovo svojstvo vam omogućava da postavite stil za sve elemente u vašem dokumentu.
