Wie kann ich Elemente in JavaScript effizient nach ID entfernen?

Entfernen von Elementen nach ID in JavaScript: Eine praktische Alternative

In JavaScript erfordert die Standardmethode zum Entfernen eines Elements das Durchlaufen bis zu seinem übergeordneten Knoten:

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

Dieser Ansatz erfordert einen zusätzlichen Schritt für den Zugriff auf das übergeordnete Element, was ineffizient sein kann. In diesem Artikel wird eine Alternative untersucht, die das Entfernen von Elementen vereinfacht, indem dem Element-Prototyp eine Remove-Methode hinzugefügt wird.

Durch die Erweiterung der Element- und NodeList-Prototypen können Sie die Remove-Methode für alle HTML-Elemente und Sammlungen einführen:

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]);
        }
    }
}

Mit diesem Zusatz können Sie nun Elemente direkt entfernen:

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

Oder für mehrere Elemente:

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

Hinweis: Diese Lösung wird von IE 7 und niedriger nicht unterstützt.

Update (2019): Node.js hat die Funktion node.remove() eingeführt, die das Entfernen von Elementen noch einfacher macht:

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

Oder für Sammlungen:

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

Dieser aktualisierte Ansatz wird von modernen Browsern, einschließlich Chrome, Firefox, Edge und Safari, weitgehend unterstützt.

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