Na túto otázku neexistuje jediná odpoveď, keďže tieto dva jazyky pristupujú k priraďovaniu premenných a manipulácii s nimi rôznymi spôsobmi. Vo všeobecnosti však jedným problémom pri pokuse o zmenu premennej CSS pomocou JavaScriptu je to, že tieto dva jazyky používajú rôzne syntaxe na deklarovanie premenných a prístup k nim. Okrem toho sú premenné CSS zvyčajne definované na úrovni šablóny štýlov a nie na úrovni jednotlivých prvkov, čo môže sťažiť prístup k nim z kódu JavaScript.
var element = document.getElementById("element");
element.style.setProperty("--variable", "new-value");
Tento riadok kódu nastavuje novú hodnotu pre premennú CSS. Prvý riadok dostane prvok s ID „element“. Druhý riadok nastavuje hodnotu CSS premennej „–variable“ na „new-value“.
CSS premenné
Premenné CSS predstavujú skvelý spôsob, ako ukladať údaje do súborov CSS bez toho, aby ste museli používať globálne premenné. Môžete ich použiť na uloženie informácií, ako je šírka alebo výška aktuálnej stránky alebo aktuálna veľkosť písma.
Ak chcete vo svojom kóde JavaScript použiť premennú CSS, musíte najprv do šablóny so štýlmi dokumentu zahrnúť vlastnosť css. Potom môžete premennú definovať pomocou kľúčového slova var:
var width = document.getElementById(“myElement”).offsetWidth;
Vlastnosť css môžete použiť aj na prístup k jednotlivým hodnotám z premennej:
var width = document.getElementById(“myElement”).offsetWidth; var height = document.getElementById(“myElement”).offsetHeight;
Ovládanie CSS
V JavaScripte existuje niekoľko spôsobov, ako ovládať CSS. Jedným zo spôsobov je použiť vlastnosť css. Táto vlastnosť vám umožňuje nastaviť štýl pre konkrétny prvok vo vašom dokumente.
Ďalším spôsobom ovládania CSS je použitie vlastnosti style. Táto vlastnosť vám umožňuje nastaviť štýl pre všetky prvky vo vašom dokumente.
