Nie ma jednej odpowiedzi na to pytanie, ponieważ oba języki podchodzą do przypisywania zmiennych i manipulowania nimi na różne sposoby. Ogólnie rzecz biorąc, jednym z problemów związanych z próbą zmiany zmiennej CSS za pomocą JavaScript jest to, że te dwa języki używają różnych składni do deklarowania zmiennych i uzyskiwania do nich dostępu. Ponadto zmienne CSS są zwykle definiowane na poziomie arkusza stylów, a nie na poziomie poszczególnych elementów, co może utrudniać dostęp do nich z poziomu kodu JavaScript.
var element = document.getElementById("element");
element.style.setProperty("--variable", "new-value");
Ta linia kodu ustawia nową wartość dla zmiennej CSS. Pierwsza linia pobiera element o identyfikatorze „element”. Druga linia ustawia wartość zmiennej CSS „–variable” na „new-value”.
Zmienne CSS
Zmienne CSS to świetny sposób na przechowywanie danych w plikach CSS bez konieczności używania zmiennych globalnych. Możesz ich używać do przechowywania informacji, takich jak szerokość lub wysokość bieżącej strony lub bieżący rozmiar czcionki.
Aby użyć zmiennej CSS w kodzie JavaScript, musisz najpierw umieścić właściwość css w arkuszu stylów dokumentu. Następnie możesz zdefiniować zmienną za pomocą słowa kluczowego var:
var width = document.getElementById("myElement").offsetWidth;
Możesz także użyć właściwości css, aby uzyskać dostęp do poszczególnych wartości ze zmiennej:
var width = document.getElementById("myElement").offsetWidth; var wysokość = document.getElementById("myElement").offsetHeight;
Kontroluj CSS
W JavaScript istnieje kilka sposobów kontrolowania CSS. Jednym ze sposobów jest użycie właściwości css. Ta właściwość umożliwia ustawienie stylu dla określonego elementu w dokumencie.
Innym sposobem kontrolowania CSS jest użycie właściwości style. Ta właściwość umożliwia ustawienie stylu dla wszystkich elementów w dokumencie.
