Error when finding element by javascript

Question

This script cannot find "bannersize" unless I write <div id="bannersize"></div> before the javascript.

The error message:

Error "Uncaught TypeError: Cannot set property 'innerHTML' of null"

My code snippet:

<script> 
function dropbox(menu){
    this.tmpmenu = document.getElementById(menu);
    this.tmpmenu.innerHTML = 'Hello'+this.tmpmenu;
}
bannersize = new dropbox('bannersize'); 
</script>
<div id="bannersize"></div>

Pointy · Accepted Answer · 2012-06-24 11:41:44Z

3

It can't find it because at the time the code is executed the element is not in the DOM. Script blocks are executed as soon as the browser sees the </script> closing tag. Your code is before the element, so when it runs the HTML parser will not yet have encountered the element with the "id" you're looking for.

Put your code after the element, or run it in a "load" event handler for the document.

answered Jun 24, 2012 at 11:41

Pointy

415k62 gold badges600 silver badges631 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user1477982 Over a year ago

Thanks You Pointy , I edit it to and it's work :) <script> window.onload = function(){ function dropbox(menu){ this.tmpmenu = document.getElementById(menu); this.tmpmenu.innerHTML = 'Hello'+this.tmpmenu; } bannersize = new dropbox('bannersize'); } </script> <div id="bannersize"></div>

Collectives™ on Stack Overflow

Error when finding element by javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related