document.getelementbyId will return null if element is not defined?

Question

In my code, I see this:

if (document.getElementById('xx') !=null) {
    //do stuff
}

if xx element is not defined, will this evaluate to true or false?

Should I write:

if (document.getElementById('xx'))

to be safe?

...`null if an element with the specified ID is not in the document` ([mdn](https://developer.mozilla.org/en-US/docs/DOM/document.getElementById)) — raina77ow, Mar 27 '13 at 18:06
@KhanhTran In fact it does return `null`. Test it in the console. — Denys Séguret, Mar 27 '13 at 18:07
Bonus link: [DOM Specification](http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-getElBId). Yes, it's `null` there too. — raina77ow, Mar 27 '13 at 18:12

score 100 · Accepted Answer · answered Mar 27 '13 at 18:07

100

console.log(document.getElementById('xx') ) evaluates to null.

document.getElementById('xx') !=null evaluates to false

You should use document.getElementById('xx') !== null as it is a stronger equality check.

answered Mar 27 '13 at 18:07

Garrett

1,658
2
17
29

2

Thanks. Is there any scenario where it will return undefined? – Victor Mar 27 '13 at 18:21
4

Thank you for showing the console.log trick. You're teaching us to fish. – Ulad Kasach Dec 04 '15 at 00:44
Just remember to remove the `console.log`s when you release! – jay Oct 10 '17 at 21:31

score 29 · Answer 2 · answered Mar 27 '13 at 18:11

29

getElementById is defined by DOM Level 1 HTML to return null in the case no element is matched.

!==null is the most explicit form of the check, and probably the best, but there is no non-null falsy value that getElementById can return - you can only get null or an always-truthy Element object. So there's no practical difference here between !==null, !=null or the looser if (document.getElementById('xx')).

answered Mar 27 '13 at 18:11

bobince

528,062
107
651
834

2

This should be the accepted answer since the only falsey value `getElementById` returns is `null`, there is no reason to check for any other value if you are only looking to check for existence. – cowbert Jan 29 '18 at 18:19

score 10 · Answer 3 · answered Mar 27 '13 at 18:08

Yes it will return null if it's not present you can try this below in the demo. Both will return true. The first elements exists the second doesn't.

Demo

Html

<div id="xx"></div>

Javascript:

   if (document.getElementById('xx') !=null) 
     console.log('it exists!');

   if (document.getElementById('xxThisisNotAnElementOnThePage') ==null) 
     console.log('does not exist!');

document.getelementbyId will return null if element is not defined?

3 Answers3

Linked

Related