Eu já precisei inúmeras vezes de saber se um elemento existe no DOM usando jQuery e sinceramente, sempre era um estresse no começo (anos atrás) depois resolvi pesquisar qual a melhor forma de fazer essa verificação. Dai descobri que todas ajudam, mas a mais eficiente é verificar o tamanho do objeto retornado pois é algo nativo do próprio javascript e claro que irá ser mais rápido que verificar com qualquer script criado. Sendo assim, veja abaixo como você pode fazer para verificar se o elemento existe usando jQuery:
$(document).ready(function() {
if ($("#id_elemento").length){
console.log("O elemento existe no DOM");
} else {
console.log("Ops! Elemento não existe no DOM");
}
});
Caso tenha gostado mas não gostaria de usar jQuery gostaria de tentar usando o próprio javascript de forma bem pura que é praticamente a mesma coisa usando o jQuery porém um pouco mais eficiente. Veja como poderia fazer com javascript:
// metodo 1: pegando pelo id html5
if (document.querySelector("#id_elemento")){
console.log("Woohoo! Elemento existe");
}
// metodo 2: pegando pelo id
if (document.getElementById("id_elemento")){
console.log("Woohoo! Elemento existe");
}
// metodo 3: pegando varios elementos
if (document.querySelectorAll(".classe_de_elementos").length) {
console.log("Woohoo! Elementos existem");
}
Como pode ter visto, ofereci várias alternativas para cada situação pois usando javascript as possibilidades são inúmeras.
Espero que tenha lhe ajudado a melhorar seu trabalho diário.
Abraços 😀