Cannot Set Property 'Display' of Undefined

Cannot set property 'display' of undefined

document.getElementsByClassName('btn-pageMenu') delivers a nodeList. You should use: document.getElementsByClassName('btn-pageMenu')[0].style.display (if it's the first element from that list you want to change.

If you want to change style.display for all nodes loop through the list:

var elems = document.getElementsByClassName('btn-pageMenu');
for (var i=0;i<elems.length;i+=1){
  elems[i].style.display = 'block';
}

to be complete: if you use jquery it is as simple as:

​$('.btn-pageMenu').css('display'​​​​​​​​​​​​​​​​​​​​​​​​​​​,'block');​​​​​​

Uncaught typerror: cannot set property 'display' of undefined

You were very close. The first issue, getElementsByClassName returns an HTMLCollection. You will need to either iterate through this list or call [0] to get the first item.

Second, the call to setTimeout should be a function as the first argument (not a string): setTimeout(hideError, 5000);.

function hideError() {  document.getElementsByClassName("errorMessage")[0].style.display = "none";}
function showError() {  document.getElementsByClassName("errorMessage")[0].style.display = "contents";  setTimeout(hideError, 5000);}
showError();

<div class="errorMessage">ERROR</div>

( Uncaught TypeError: Cannot set property 'display' of undefined

document.getElementsByClassName("nav")

The getElementsByClassName method of Document interface returns an
array-like object of all child elements which have all of the given
class name(s). When called on the document object, the complete
document is searched, including the root node. You may also call
getElementsByClassName() on any element; it will return only elements
which are descendants of the specified root element with the given
class name(s).

you probably need to do the following (assuming you only have one element with class name as nave):

(document.getElementsByClassName("nav")[0]).style.display='flex';

Uncaught TypeError: Cannot set property 'display' of undefined and loader not disappearing

This line:

var loader = document.getElementById('loader').style.display='block';

initializes the variable loader with the string "block". You have to use two separate statements:

var loader = document.getElementById('loader');
loader.style.display='block';

Simple Image Hiding--Uncaught TypeError: Cannot set property 'display' of undefined

There is a misspelled word 'stlye' which should be 'style' at this line:

document.getElementById("menuIconImage").stlye.display = "none";

should be

document.getElementById("menuIconImage").style.display = "none";

My analysis to determine the issue started with the text of the error which indicated that the issue wasn't with finding the element (i.e. the document.getElementById("menuIconImage") part worked). If the element wasn't found we'd get an error with text Uncaught TypeError: Cannot read property 'style' of null. This narrowed down where the issue was.

Uncaught TypeError: Cannot set property 'display' of undefined

As previously stated in comments, your code has some issues, your line (the one that is triggering the error, can be optimized in the following way:

$('#loading').css("display","inline"); //Selector is ok now... 

In the other hand, I also noticed that you have a second selector $('user') that won´t work. Remember that anything without a dot, or a sharp will be considered as an element selector (loading, and user elements, won´t exist in your document unless you created it.

Remember:

$("#myId") //id selector
$(".myClass") //class selector

If "user" is the form name, the code may work. Remember that you want to catch the form submit event.

Regards,

Guillermo

---

Related Topics