Why !document.querySelectorAll not working for multiple id

Question

I currently have this working , but i need to add an additional element so i switched to SelectorAll , but it doesn't work

This is working

if(!document.getElementById('body_options_45')) {
//Do Stuff
}

When i add a 2nd ID and switch to selectorALl , it stops working

if(!document.querySelectorAll('#body_options_45, #body_options_113')) {
   //Do Stuff
}

What am i missing here ?

You are missing what `querySelectorAll()` returns. Look it up in the docs and you'll see, and will understand how to make it work. — Asons, May 05 '19 at 17:12

Mati Tucci · Answer 1 · 2019-05-05T17:11:48.883

4

querySelectorAll returns a NodeList. You will need to check the length like this: if (!document.querySelectorAll('#body_options_45, #body_options_113').length)

edited May 05 '19 at 17:11

answered May 05 '19 at 17:07

Mati Tucci

2,826
5
28
40

score 0 · Answer 2 · answered May 05 '19 at 18:26

querySelectorAll() returns a NodeList. NodeLists are not arrays but, in this particular case, the behavour is the same: empty arrays and empty NodeLists are both truthy.

![] //returns false

!emptyNodeList //returns false

To check if your NodeList is empty or not, use the length property:

if(document.querySelectorAll('#body_options_45, #body_options_113').length===0) {
   //do stuff
}

Why !document.querySelectorAll not working for multiple id

2 Answers2