Como remover elemento da página com JavaScript

Neste artigo você vai aprender a como remover elemento da página com JavaScript, de uma maneira muito simples e prática

Fala programador(a), beleza? Bora aprender mais sobre DOM e remoção de elementos com JS!

A ideia para resolver este problema é bem simples

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

Primeiramente vamos precisar acessar o elemento pai, do elemento que precisa ser removido

Então poderemos aplicar o método removeChild no nó alvo

Vamos ver uma aplicação prática desta solução:

<div>
  <p id="elemento-para-remover">Remover este parágrafo</p>
</div>

Este é o nosso HTML, nosso objetivo é remover o parágrafo com o id de elemento-para-remover

Veja agora o código JavaScript necessário:

var elemento = document.querySelector("#elemento-para-remover");

elemento.parentNode.removeChild(elemento);

No código acima selecionamos primeiramente o parágrafo, pelo id que o HTML nos fornece

Depois identificamos o nó pai com o método parentNode

E por fim aplicamos removeChild no próprio nó selecionado

Desta forma o elemento é automaticamente removido, e resolvemos o nosso problema, viu como foi simples?

Conclusão

Neste artigo vimos como remover elemento da página com JavaScript

A técnica utiliza foi: selecionar o elemento alvo e depois o pai do mesmo

Com isso aplicamos o método removeChild, no próprio elemento que foi primeiramente selecionado

E com esta sequência de passos resolvemos o problema

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube