Prevent undefined of elements that may or may not appear in the document

Question

Prevent undefined of elements that may or may not appear in the document

Navigation

#1 by (2 votes)

1

The JS DOM below is for modifying through classes, the styles of two elements that are dynamically created in the document. But it is not always that these elements will appear in the document. Maybe they show up, maybe not. When they are, the code works fine, and when they are not, the console returns TypeError: jsNavButton is undefined . How do I prevent this?

var jsNavButton = document.querySelectorAll(".js-nav-toggle")[0], jsNavHidden = document.querySelectorAll(".js-nav-hidden")[0]; jsNavButton.style.backgroundColor = "tomato"; jsNavHidden.style.backgroundColor = "blue";

javascript

asked by anonymous 01.07.2018 / 17:33

1 answer

SQL - How to undo ambiguous outer join? Fatal error: Allowed memory size of 16777216 bytes Exhausted (tried to allocate 6295552 bytes) in C: \ xampp \ htdocs \ Crawler \ temperatura.php on line 11

score 2 · Accepted Answer

Verify that the elements exist with if . If the element does not exist, nothing is done and does not return error:

var jsNavButton = document.querySelectorAll(".js-nav-toggle")[0],
   jsNavHidden = document.querySelectorAll(".js-nav-hidden")[0];

if(jsNavButton){
   jsNavButton.style.backgroundColor = "tomato";
}

if(jsNavHidden){
   jsNavHidden.style.backgroundColor = "blue";
}