Wie entferne ich eine CSS-Klasse mit Vanilla-JavaScript?

CSS-Klasse entfernen: Ein umfassender JavaScript-Leitfaden

Das Entfernen einer CSS-Klasse aus einem Element mithilfe von Vanilla-JavaScript ist eine häufige Aufgabe von Webentwicklern . Im Gegensatz zu jQuery, das eine vereinfachte API bereitstellt, bietet JavaScript einen vielseitigen und einfachen Ansatz für diesen Vorgang.

Um eine CSS-Klasse effektiv zu entfernen, besteht die bevorzugte und standardisierte Technik darin, die Eigenschaft classList zu nutzen. Es wird von allen modernen Browsern unterstützt und ermöglicht eine präzise Klassenmanipulation.

LÖSUNG

Der folgende Codeausschnitt zeigt die richtige Syntax:

ELEMENT.classList.remove("CLASS_NAME");

Dieser Codeausschnitt Entfernt die angegebene Klasse (CLASS_NAME) aus dem Zielelement (ELEMENT).

BEISPIEL

Betrachten Sie das folgende Beispiel, in dem wir eine Schaltfläche haben, die das Entfernen der „roten“ Klasse aus einem Div umschaltet:

remove.onclick = () => {
  const el = document.querySelector('#el');
  el.classList.remove("red");
};

.red {
  background: red
}

<div>
<p>Wenn Sie auf die Schaltfläche „Klasse entfernen“ klicken, wird der „rote“ Hintergrund aus der entfernt div.</p>
<p>Zu verstehen, wie man CSS-Klassen mit JavaScript entfernt, ist für die Aufrechterhaltung einer dynamischen Webseite mit präziser Kontrolle über Elementstile von entscheidender Bedeutung.</p>
</div>

Das obige ist der detaillierte Inhalt vonWie entferne ich eine CSS-Klasse mit Vanilla-JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!