Metody i Właściwości

Metody i właściwości do manipulacji stylami CSS to narzędzia, które umożliwiają programowe zmienianie stylów CSS elementów HTML za pomocą języka JavaScript. Te metody i właściwości umożliwiają dostęp do stylów CSS elementu, a także umożliwiają dodawanie, usuwanie i zmianę wartości stylów. Oto najczęściej używane metody i właściwości do manipulowania stylami CSS w języku JavaScript:

element.style - ta właściwość pozwala na dostęp do stylów wewnętrznych elementu i umożliwia ustawianie nowych wartości. Można użyć tej właściwości do ustawienia różnych stylów, takich jak kolor, tło, marginesy itp.

								
const element = document.getElementById("my-element");
element.style.color = "red";

element.classList - właściwość pozwalająca na dostęp do listy klas CSS elementu i umożliwia dodawanie, usuwanie i przełączanie klas.

								
const element = document.getElementById("my-element");
element.classList.add("my-class");
element.classList.remove("another-class");
element.classList.toggle("toggle-class");

window.getComputedStyle() - metoda pozwalająca na uzyskanie obiektu CSSStyleDeclaration, który zawiera obliczone wartości stylów CSS dla danego elementu.

								
const element = document.getElementById("my-element");
const styles = window.getComputedStyle(element);
const color = styles.getPropertyValue("color");

e.style.setProperty() - ta metoda umożliwia ustawienie określonej wartości dla konkretnej właściwości CSS.

								
const element = document.getElementById("my-element");
element.style.setProperty("color", "red", "important");

e.style.removeProperty() - metoda umożliwiająca usunięcie określonej właściwości CSS z elementu.

								
const element = document.getElementById("my-element");
element.style.removeProperty("color");