Wie kann ich CSS-Klassen mit reinem JavaScript aus Elementen entfernen?

CSS-Klassen aus Elementen mit reinem JavaScript entfernen

Im Bereich der Webentwicklung besteht die Aufgabe darin, CSS-Klassen aus Elementen zu entfernen, ohne darauf zurückgreifen zu müssen jQuery kommt oft vor. Diese Aufgabe erfordert ein gründliches Verständnis der JavaScript-Funktionen.

Der moderne Ansatz: ClassList to the Rescue

Um dieses Ziel auf eine Weise zu erreichen, die den aktuellen Webstandards entspricht, muss die Die Eigenschaft classList ist die bevorzugte Methode. Dieses Attribut wird von den meisten gängigen Browsern unterstützt und bietet ein direktes Mittel zur Bearbeitung von Klassen.

Implementierung in Aktion

Um die Verwendung von classList zu veranschaulichen, betrachten Sie den folgenden Code Snippet:

ELEMENT.classList.remove("CLASS_NAME");

Hier ist ein Beispiel zur weiteren Erläuterung Klarheit:

<div>

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

remove.onclick = () => {
  remove();
};

In diesem Code verwendet die Funktion „remove()“ classList.remove(), um die „rote“ Klasse aus dem Element mit der ID el zu entfernen. Beim Klicken auf die Schaltfläche mit der ID „Entfernen“ wird diese Aktion ausgelöst, was zur Entfernung des entsprechenden CSS-Stils führt.

Das obige ist der detaillierte Inhalt vonWie kann ich CSS-Klassen mit reinem JavaScript aus Elementen entfernen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!