按 ID 删除元素

使用标准 JavaScript 删除元素时，必须先转到其父级：

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

首先必须转到父节点对我来说有点奇怪，JavaScript 是否有这样的原因？

javascript

答案

我知道增加原生 DOM 功能并不总是最好或最流行的解决方案，但这适用于现代浏览器。

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

然后你可以删除这样的元素

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

要么

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

注意：此解决方案不适用于 IE 7 及更低版本。有关扩展 DOM 的更多信息，请阅读本文。

Crossbrowser 和 IE> = 11：

document.getElementById("element-id").outerHTML = "";

您可以创建一个remove功能，这样您就不必每次都考虑它：

function removeElement(id) {
    var elem = document.getElementById(id);
    return elem.parentNode.removeChild(elem);
}