Wie kann ich HTML-Elemente in JavaScript effizient entfernen?

Elemente mit Leichtigkeit entfernen: nativeDOM und node.remove() erkunden

Bei der Aufgabe, HTML-Elemente in JavaScript zu entfernen, gibt es das schon seit langem eine wahrgenommene Kuriosität: Zuerst muss der übergeordnete Knoten ausgewählt werden. Bis vor kurzem erforderte die Standardmethode den folgenden Code:

var element = document.getElementById("element-id");
element.parentNode.removeChild(element);

Ein verbesserter Ansatz

Für moderne Browser bietet die Erweiterung der nativen DOM-Funktionen eine Lösung, die sich besser anfühlt intuitiv:

Element.prototype.remove = function() {
    this.parentElement.removeChild(this);
}
NodeList.prototype.remove = HTMLCollection.prototype.remove = function() {
    for(var i = this.length - 1; i >= 0; i--) {
        if(this[i] && this[i].parentElement) {
            this[i].parentElement.removeChild(this[i]);
        }
    }
}

Jetzt wird das Entfernen von Elementen zu einem Brise:

document.getElementById("my-element").remove();

oder

document.getElementsByClassName("my-elements").remove();

Der Triumph von node.remove()

In einem aktuellen Update, node.remove( ) hat sich als Retter für diese Aufgabe herausgestellt und ist in allen modernen Browsern außer verfügbar IE:

document.getElementById("my-element").remove();

oder

[...document.getElementsByClassName("my-elements")].map(n => n && n.remove());

Obwohl diese Lösungen in IE 7 und niedriger möglicherweise nicht funktionieren, bieten sie eine viel reibungslosere und logischere Möglichkeit, Elemente aus dem DOM zu entfernen und zu verlassen hinter einem effizienteren und unkomplizierteren Codierungserlebnis.

Das obige ist der detaillierte Inhalt vonWie kann ich HTML-Elemente in JavaScript effizient entfernen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!