Element: className-Eigenschaft

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die className-Eigenschaft der Element-Schnittstelle ruft den Wert des class-Attributs des angegebenen Elements ab und setzt ihn.

Wert

Eine Zeichenfolgenvariable, die die Klasse oder durch Leerzeichen getrennte Klassen des aktuellen Elements darstellt.

Beispiele

const el = document.getElementById("item");
el.className = el.className === "active" ? "inactive" : "active";

Der Name className wird für diese Eigenschaft anstelle von class verwendet, weil es Konflikte mit dem "class"-Schlüsselwort in vielen Sprachen gibt, die zum Manipulieren des DOMs verwendet werden.

className kann auch eine Instanz von SVGAnimatedString sein, wenn das element ein SVGElement ist. Es ist einfacher, das class-Attribut eines Elements mit Element.getAttribute und Element.setAttribute zu erhalten/setzen, wenn Sie mit SVG-Elementen arbeiten. Beachten Sie jedoch, dass Element.getAttribute null zurückgibt und nicht "", wenn das element ein leeres class-Attribut hat.

elm.setAttribute("class", "my-class");
const myClass = elm.getAttribute("class");

Note: class ist der Name eines HTML-Attributs, während className der Name einer DOM-Eigenschaft ist.

Spezifikationen

Specification
DOM # ref-for-dom-element-classname①

Browser-Kompatibilität

Siehe auch

element.classList