Verifique se NÃO existe um div com javascript

92

Verificar se existe um div é bastante simples

if(document.getif(document.getElementById('if')){

}

Mas como posso verificar se um div com o id fornecido não existe?

Wilson
fonte

Respostas:

151
var myElem = document.getElementById('myElementId');
if (myElem === null) alert('does not exist!');
Jimbo Jonny
fonte
1
Muito Obrigado. Estou usando janelas modais AngularJS e Bootstrap, por algum motivo, o JQuery não conseguiu encontrar elementos na janela modal. Vanilla JS funcionou bem.
krex
75
if (!document.getElementById("given-id")) {
//It does not exist
}

A instrução document.getElementById("given-id")retorna nullse um elemento com given-idnão existe, e nullé falsa, o que significa que se traduz em falso quando avaliada em uma instrução if. ( outros valores falsos )

Esailija
fonte
4
Olá, Esailija. Acho que você pode ser a melhor resposta se adicionar detalhes ao motivo "!" funciona bem. Talvez dizendo que ele retorna nulo, o que é falso. +1 de mim.
Alex KeySmith
4
As pessoas poderiam pesquisar no Google o que "!" significa em javascript ou em muitos outros idiomas. Não é ciência de foguetes.
CommandZ
7
@CommandZ: Por que forçar as pessoas a pesquisar no Google, quando uma explicação simples em linha seria mais rápida. Além disso, acredito que o que Alex está querendo dizer é que nullavalia para false, o que não é do conhecimento comum (C # é uma linguagem em nullque não é igual a falso).
Doug S de
1
@DougS nullnão é igual a falseaté mesmo na comparação de igualdade coercitiva - a chamada para ToBoolean(null)retornosfalse
Esailija
10

Tente obter o elemento com o ID e verifique se o valor de retorno é nulo:

document.getElementById('some_nonexistent_id') === null

Se estiver usando jQuery, você pode fazer:

$('#some_nonexistent_id').length === 0
Hristo
fonte
2
Existe uma razão pela qual você não pode simplesmente fazer !document.getElementById('foo')?
Snuffleupagus
@ElatedOwl Pode acontecer que você execute uma operação em muitas entradas e queira verificar se elas existem. Seria inútil document.getElementById()então.
Danon
9

Verifique meu código JavaScript e JQuery:

JavaScript:

if (!document.getElementById('MyElementId')){
    alert('Does not exist!');
}

JQuery:

if (!$("#MyElementId").length){
    alert('Does not exist!');
}
Chinmay235
fonte
4

getElementByIdretorna nullse não houver tal elemento.

SLaks
fonte
1

Isso funciona com:

 var element = document.getElementById('myElem');
 if (typeof (element) != undefined && typeof (element) != null && typeof (element) != 'undefined') {
     console.log('element exists');
 }
 else{
     console.log('element NOT exists');
 }
Ema.H
fonte
1

Existe uma solução ainda melhor. Você nem precisa verificar se o elemento retorna null. Você pode simplesmente fazer isso:

if (document.getElementById('elementId')) {
  console.log('exists')
}

Esse código só será registrado existsno console se o elemento realmente existir no DOM.


fonte
0

Faço abaixo e verifico se idexiste e executo a função se existir.

var divIDVar = $('#divID').length;
if (divIDVar === 0){ 
    console.log('No DIV Exist'); 
} else{  
    FNCsomefunction(); 
}   
Cyber
fonte