Pregunta Eliminar elemento por id


Al eliminar un elemento con JavaScript estándar, primero debe ir a su elemento primario:

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

Tener que ir al nodo padre primero me parece un poco extraño, ¿hay alguna razón por la que JavaScript funcione así?


905
2017-08-01 18:47


origen


Respuestas:


Sé que aumentar las funciones DOM nativas no siempre es la mejor o la más popular, pero funciona bien para los navegadores modernos.

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

Y luego puedes eliminar elementos como este

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

o

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

Nota: esta solución no funciona para IE 7 y versiones posteriores. Para obtener más información sobre cómo extender el DOM, lea esto artículo.


500
2017-08-08 07:56



Crossbrowser e IE> = 11:

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

197
2017-10-10 14:28



Podrías hacer un remove función para que no tenga que pensar en ello cada vez:

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

130
2017-08-02 19:58



Es lo que admite el DOM. Busque en esa página "eliminar" o "eliminar" y eliminarChild es el único que elimina un nodo.


92
2017-08-01 23:16



El DOM está organizado en un árbol de nodos, donde cada nodo tiene un valor, junto con una lista de referencias a sus nodos secundarios. Asi que element.parentNode.removeChild(element) imita exactamente lo que está sucediendo internamente: Primero ve al nodo padre, luego elimina la referencia al nodo secundario.

A partir de DOM4, se proporciona una función auxiliar para hacer lo mismo: element.remove(). Esta funciona en el 87% de los navegadores (a partir de 2016), pero no IE 11. Si necesita admitir navegadores más antiguos, puede:


73
2017-12-30 17:41



Para eliminar un elemento:

 var elem = document.getElementById("yourid");
 elem.parentElement.removeChild(elem);

Para eliminar todos los elementos con, por ejemplo, un nombre de clase determinado:

 var list = document.getElementsByClassName("yourclassname");
 for(var i = list.length - 1; 0 <= i; i--)
 if(list[i] && list[i].parentElement)
 list[i].parentElement.removeChild(list[i]);

33
2017-08-05 08:08



solo puedes usar element.remove()


19
2018-02-28 16:17