la chiamata ad un elemento esistente nella pagina deve essere fatta dopo che l'elemento è stato caricato nella memoria del browser.

per cui, se come sembra, il tuo javascript dove quelle righe sono incluse, viene caricato nell' header e un suo runtime viene invocato prima che il tag con quell' id sia letto dal browser, è troppo precoce e darà errore.

Tu puoi caricare un javascript nell' head di un documento: è corretto.

Ma le esecuzioni delle funzioni incluse in quel javascript, o statement procedurali che richimassero elementi presenti nella pagina, debbono essere fatte dopo che anche gli altri elementi coinvolti sono stati caricati in memoria.

per cui:

head
script esterno (senza righe che richiamino già qui un elemento della pagina)
fine head
body
bla bla e vari tag incluso quello con l' id specificato
<script>
e qui chiami document.getElementById
</script>
bla bla bla
fine body