getElementByID element is null

Question

In a scrip I try to get the width of an element like so:

var container = document.getElementById('content');
var cw = container.clientWidth;

But it gives me this error in the console:

Uncaught TypeError: Cannot read property 'clientWidth' of null

Executing the same statements in the console however, produces the desired value. How is that possible?

Screenshot of the console:

are you attempting to execute this script before the dom is loaded (ie before the #content div exists)? — Jesse Kernaghan, Mar 01 '16 at 23:12
You should show also your html page and script placement. probably when you execute script, the element with id container is still not there. While when you access the console and type it, the element is ready for use — AndreaBogazzi, Mar 01 '16 at 23:14
@Flip happens to the best of them. I generally put all my scripts at the bottom of the document to avoid headache and often unncessary `document.ready` calls. — Jesse Kernaghan, Mar 01 '16 at 23:18

score 0 · Answer 1 · answered Mar 01 '16 at 23:14

This script is loading before the dom has finished loading (or in particular the div#content). ensure that this script is being inserted as the last element of the body (not in the head) or if div#content is being dynamically created, you may want to invest in jQuery's $(document).ready function

getElementByID element is null

1 Answers1