Не удается прочитать свойство «...» пустому

Question

У меня этот код здесь, и я уверен, что я передал имя правильно, но он по-прежнему говорит утратившим:

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;}"); 

Я попытался набрав geth("sterile") на devconsole в Chrome и он возвращается правильно, но когда я запускаю это через файл я всегда получаю Uncaught TypeError....

линия ошибка 10.

Answer 1

Предполагая, что вы в том числе ваш JavaScript в головной метке, попробуйте в том числе он перед тегом </body> вместо этого. Это гарантирует, что браузер будет знать обо всех элементах к тому времени, когда он проанализирует ваш javascript.

Answer 2

Если вы хотите возиться с DOM, сначала нужно дождаться его готовности. Один из способов сделать это, например:

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

Использование addEventListener также Unobstrusive метод Javascript, который является путь хорошая практика. Вы автоматически получаете преимущество в том, чтобы обернуть свой код внутри закрытия.