0

Quando eu precisava apagar completamente uma tabela ou qualquer outro elemento html eu usava jquery $.empty() no elemento pai onde o elemento estava.

Existe alguma forma nativa no javascript que faça essa remoção de elementos html.

ex: tabela.delete()

No caso da tabela ela é toda gerada na DOM.

2 Respostas 2

2

Primeiramente você precisa declarar um método para remover o elemento pelo ID dele:

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

E então, assumindo que sua tabela tem o ID minha-tabela, você a pode remover com:

document.getElementById("minha-tabela").remove();

Ou então, selecionar ela por alguma classe:

document.getElementsByClassName("table-sm").remove();

Por alternativa a todos estes acima, você também pode zerar o HTML do elemento:

document.getElementById("minha-tabela").outerHTML = "";

Fonte desta pergunta.

1

O método .empty() do jQuery remove todos os os elementos de dentro de um elemento (child nodes), mas mas mantém o elemento em si no DOM.

Uma forma similar em JavaScript puro, seria esvaziando a propriedade .innerHTML:

elemento.innerHTML = '';

Por outro lado, se você quer remover o próprio elemento (não apenas os seus filhos), o que não tem a ver com o .empty() do jQuery mas com o .remove(), em JS puro seria esvaziar a propriedade .outerHTML:

elemento.outerHTML = '';

Ou usar a API .remove(), que não tem suporte no Internet Explorer:

elemento.remove();

Mas existe um polyfill compatível com IE9+.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .