JavaScript

Como verificar se elemento existe no DOM com JavaScript

4 de janeiro de 2022

Como verificar se elemento existe no DOM com JavaScript

Neste artigo você vai aprender a verificar se elemento existe no DOM, utilizando uma abordagem super simples e rápida

verificar se elemento existe no DOM capa

Fala programador(a), beleza? Bora aprender mais sobre DOM e JavaScript!

Para resolver o nosso problema vamos primeiramente ter que selecionar o elemento no DOM

Podemos utilizar qualquer um dos métodos:

  • querySelector;
  • getElementById;
  • getElementsByClassName;

Tendo o elemento selecionado, ou pelo menos aplicando o resultado do seletor a uma variável

Vamos utilizar o método contains, que fica em body, uma propriedade de document

Este método nos retorna um booleano, se for verdadeiro é por que o elemento está presente na página/DOM

Vamos ver um exemplo prático do que foi explicado acima:

const myElement = document.querySelector("div")

const exists = document.body.contains(myElement)

console.log(exists)

Na primeira linha há a seleção do elemento e depois criamos a variável exists

Esta variável contém o resultado do método contains, que é um true ou false

Caso o elemento não esteja presente no DOM teremos o resultado de false, fácil não? 🙂

Conclusão

Neste artigo você aprendeu a como verificar se elemento existe no DOM

Utilizamos um método de seleção de elementos, que foi o querySelector

E depois validamos se o elemento está no DOM com o método contains

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!

Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias

O link acima contém um cupom de desconto para os cursos!
Subscribe
Notify of
guest
0 Comentários
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x