CODEWITHSUNDEEP
javascript
potasmic
potasmic

Reputation: 1097

Cannot read property '...' of null

I'm having this code over here and I'm pretty sure I've passed the name properly but it still says as null:

var w = window.innerWidth;
var h = window.innerHeight;
var inj = document.getElementById("sterile").innerHTML;

function inject(data) {
    document.getElementById("sterile").innerHTML+=data;
}

function geth(elem) {
    return document.getElementById(elem).clientHeight;
}

inject( ".fullscreen { height:"+h+"px;}");

inject( ".headpad {padding-top:"+h-(geth("headwrap")/2)+"px;}");

I tried typing geth("sterile") onto the Chrome's devconsole and it returns properly but when I launch this through a file I always get Uncaught TypeError....

The error line was 10.

Upvotes: 0

Views: 2711

Answers (2)

André Leria
André Leria

Reputation: 392

If you want to mess around with the DOM, you should first wait for it to be ready. One way to do such is:

window.addEventListener("DOMContentLoaded", function() {
    // Your logic here
}, false);

Using addEventListener is also an Unobstrusive Javascript technique, which is a way good practice. You automatically get the advantage of wrapping your code inside a closure.

Upvotes: 1

Josh Harrison
Josh Harrison

Reputation: 5994

Assuming you're including your javascript in the head tag, try including it just before the </body> tag instead. This ensures that the browser is aware of all elements by the time it parses your javascript.

Upvotes: 2

Related Questions