Sellele küsimusele pole ühest vastust, kuna need kaks keelt lähenevad muutujate määramisele ja manipuleerimisele erineval viisil. Üldiselt on aga üks probleem CSS-muutuja JavaScriptiga muutmisel see, et need kaks keelt kasutavad muutujate deklareerimiseks ja neile juurde pääsemiseks erinevat süntaksit. Lisaks on CSS-muutujad tavaliselt määratletud stiililehe tasemel, mitte üksikute elementide tasemel, mis võib muuta neile JavaScripti koodist juurdepääsu raskeks.
var element = document.getElementById("element");
element.style.setProperty("--variable", "new-value");
See koodirida määrab CSS-i muutujale uue väärtuse. Esimene rida saab elemendi ID-ga "element". Teine rida määrab CSS-i muutuja “–muutuja” väärtuseks “new-value”.
CSS-i muutujad
CSS-muutujad on suurepärane viis andmete salvestamiseks CSS-failidesse ilma globaalseid muutujaid kasutamata. Saate neid kasutada teabe salvestamiseks, nagu praeguse lehe laius või kõrgus või praegune fondi suurus.
JavaScripti koodis CSS-i muutuja kasutamiseks peate esmalt lisama oma dokumendi stiililehele css-i atribuudi. Seejärel saate muutuja määratleda märksõna var abil:
var width = document.getElementById("minuElement").offsetWidth;
Saate kasutada ka atribuuti css, et pääseda juurde muutuja üksikutele väärtustele:
var width = document.getElementById("minuElement").offsetWidth; var kõrgus = document.getElementById(“minuElement”).offsetHeight;
CSS-i juhtimine
JavaScriptis on CSS-i juhtimiseks mitu võimalust. Üks võimalus on kasutada css-i atribuuti. See atribuut võimaldab teil määrata dokumendi konkreetse elemendi stiili.
Teine viis CSS-i juhtimiseks on stiili atribuudi kasutamine. See atribuut võimaldab teil määrata kõigi dokumendi elementide stiili.
