Check if a div does NOT exist with javascript

JavascriptHtmlIf Statement

Javascript Problem Overview


Checking if a div exists is fairly simple

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

}

But how can I check if a div with the given id does not exist?

Javascript Solutions


Solution 1 - Javascript

var myElem = document.getElementById('myElementId');
if (myElem === null) alert('does not exist!');

Solution 2 - Javascript

if (!document.getElementById("given-id")) {
//It does not exist
}

The statement document.getElementById("given-id") returns null if an element with given-id doesn't exist, and null is falsy meaning that it translates to false when evaluated in an if-statement. (other falsy values)

Solution 3 - Javascript

Check both my JavaScript and JQuery code :

JavaScript:

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

JQuery:

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

Solution 4 - Javascript

Try getting the element with the ID and check if the return value is null:

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

If you're using jQuery, you can do:

$('#some_nonexistent_id').length === 0

Solution 5 - Javascript

getElementById returns null if there is no such element.

Solution 6 - Javascript

There's an even better solution. You don't even need to check if the element returns null. You can simply do this:

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

That code will only log exists to console if the element actually exists in the DOM.

Solution 7 - Javascript

That works with :

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

Solution 8 - Javascript

I do below and check if id exist and execute function if exist.

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

Solution 9 - Javascript

All these answers do NOT take into account that you asked specifically about a DIV element.

document.querySelector("div#the-div-id")

@see https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionWilsonView Question on Stackoverflow
Solution 1 - JavascriptJimbo JonnyView Answer on Stackoverflow
Solution 2 - JavascriptEsailijaView Answer on Stackoverflow
Solution 3 - JavascriptChinmay235View Answer on Stackoverflow
Solution 4 - JavascriptHristoView Answer on Stackoverflow
Solution 5 - JavascriptSLaksView Answer on Stackoverflow
Solution 6 - Javascriptuser2230470View Answer on Stackoverflow
Solution 7 - JavascriptEma.HView Answer on Stackoverflow
Solution 8 - JavascriptCyberView Answer on Stackoverflow
Solution 9 - JavascriptsMylesView Answer on Stackoverflow