javascript – Cannot read property addEventListener of null

javascript – Cannot read property addEventListener of null

I think the easiest approach would be to just check that el is not null before adding an event listener:

var el = document.getElementById(overlayBtn);
if(el){
  el.addEventListener(click, swapper, false);
}

It seems that document.getElementById(overlayBtn); is returning null because it executes before the DOM fully loads.

If you put this line of code under

window.onload=function(){
  -- put your code here
}

then it will run without issue.

Example:

window.onload=function(){
    var mb = document.getElementById(b);
    mb.addEventListener(click, handler);
    mb.addEventListener(click, handler2);
}


function handler() {
    $(p).html(<br> + $(p).text() + <br>You clicked me-1!<br>);
}

function handler2() {
    $(p).html(<br> + $(p).text() + <br>You clicked me-2!<br>);
}

javascript – Cannot read property addEventListener of null

I faced a similar situation. This is probably because the script is executed before the page loads. By placing the script at the bottom of the page, I circumvented the problem.

Leave a Reply

Your email address will not be published.