getElementById fails to find element [duplicate]

Question

So. I just bought Jon Ducket's simplistic book on JavaScript. Great read.

And I've been trying one of the first examplen, "Creating an Array." I'm pretty sure I did everything exactly as the book says, but it won't work. The element I'm trying to print within stays empty. Hear's my body:

<body> <script type="text/javascript" src="Excersize1.js"></script> <p id='colors'></p> </body>

And hear's my JavaScript in that file.

var colors; // array for colors colors = ['white', 'black', 'custom']; var el = document.getElementById('colors'); el.textContent = colors[0];

Any thoughts?

I just bought Jon Ducket's simplistic book on JavaScript. - I'd demand a refund — Jaromanda X
– Jaromanda X, Commented Jan 9, 2016 at 3:20
I'm curious why you would have given this question a title of "External JavaScript". Besides the fact that that title does a horrible job of describing your question, I wonder why you thought this problem had to do with external JS at all. If you thought it did, it would have been quite easy to try replacing the <script src= tag with in-line JS, to see if that was in fact the problem. — user663031
– user663031, Commented Jan 9, 2016 at 4:36

Nick Zuber · Accepted Answer · 2016-01-09 03:21:22Z

It's because your javascript is being executed before the elements on your page is able load.

// Searches the DOM for an element with the ID 'colors' // but will fail to find it because it hasn't been rendered yet var el = document.getElementById('colors');

Try moving your javascript at the bottom of your page, so by the time it's run, the rest of your document will have loaded.

<body> <p id='colors'></p> <!-- Run the scripts last to help make sure the page is loaded first --> <script type="text/javascript" src="Excersize1.js"></script> </body>

Collectives™ on Stack Overflow

getElementById fails to find element [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related