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 des Element-Interfaces liest und setzt den Wert des class-Attributs des angegebenen Elements.

Wert

Eine Zeichenfolge, die die Klasse oder die durch Leerzeichen getrennten 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 verwendet anstelle von class, aufgrund von Konflikten mit dem "class"-Schlüsselwort in vielen Sprachen, die zur Manipulation des DOM 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 abzurufen bzw. zu setzen, wenn Sie es mit SVG-Elementen zu tun haben. Beachten Sie jedoch, dass Element.getAttribute null anstelle von "" zurückgibt, 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 Standard # ref-for-dom-element-classname①

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch

element.classList