Na to vprašanje ni enoznačnega odgovora, saj se oba jezika dodeljevanja spremenljivk in manipulacije lotevata na različne načine. Na splošno pa je ena težava pri poskusu spreminjanja spremenljivke CSS z JavaScriptom ta, da oba jezika uporabljata različni sintaksi za deklaracijo in dostop do spremenljivk. Poleg tega so spremenljivke CSS običajno definirane na ravni slogovnega lista in ne na ravni posameznega elementa, kar lahko oteži dostop do njih znotraj kode JavaScript.
var element = document.getElementById("element");
element.style.setProperty("--variable", "new-value");
Ta vrstica kode nastavlja novo vrednost za spremenljivko CSS. Prva vrstica dobi element z ID-jem "element". Druga vrstica nastavi vrednost spremenljivke CSS »–variable« na »new-value«.
spremenljivke CSS
Spremenljivke CSS so odličen način za shranjevanje podatkov v datoteke CSS, ne da bi morali uporabljati globalne spremenljivke. Uporabite jih lahko za shranjevanje informacij, kot je širina ali višina trenutne strani ali trenutna velikost pisave.
Če želite v kodi JavaScript uporabiti spremenljivko CSS, morate lastnost css najprej vključiti v slogovni list dokumenta. Nato lahko definirate spremenljivko s ključno besedo var:
var width = document.getElementById(“myElement”).offsetWidth;
Lastnost css lahko uporabite tudi za dostop do posameznih vrednosti iz spremenljivke:
var width = document.getElementById(“myElement”).offsetWidth; var height = document.getElementById(“myElement”).offsetHeight;
Nadzor CSS
V JavaScriptu obstaja nekaj načinov za nadzor CSS. Eden od načinov je uporaba lastnosti css. Ta lastnost vam omogoča, da nastavite slog za določen element v dokumentu.
Drug način nadzora CSS je uporaba lastnosti style. Ta lastnost vam omogoča, da nastavite slog za vse elemente v dokumentu.
