Lösung: Javascript – TypeError: document.getElementById(…) is null

1 Leser hat sich bedankt

(Durchschnitt: 0,00 von 5 – 0 Stimme(n)) - Fehler: Nicht angemeldet!

Möchte man mit Javascript und dem Befehl document.getElementById auf bestimmte Elemente einer Webseite zugreifen, kann es schnell zu einem Fehler kommen: Das Skript funktioniert nicht und der Browser meldet über die Fehlerkonsole den Fehler “TypeError: document.getElementById(…) is null”. Wenn es kein Tippfehler ist und das Webseiten-Element den gleichen Namen hat, auf den man mit getElementById() zugreift, liegt es sehr wahrscheinlich an der Platzierung des Javascript.

Hat man, ganz klassisch, das Javascript im <head> Bereich der Webseite definiert, kann es schnell zu demTypeError Fehler kommen – dabei ist es ganz egal, ob das Skript “inline” direkt in die Seite geschrieben wurde oder als externes Skript eingeladen wird: Solange das Webseiten-Element, auf dessen ID man zugreifen möchte, nicht vorhanden ist, ist der Wert von “document.getElementById()” = “null”: Man kann nicht darauf zugreifen.

Lösung: So umgeht man den TypeError!

Die Lösung ist dabei sehr einfach: Das Javascript darf nicht bereits im <head> Bereich der Seite stehen, sondern muss NACH dem Element eingebaut werden, auf das man zugreifen möchte – das kann dann zum Beispiel so aussehen wie in unserem einfachen Javascript-Fader:

<html>
<head>
<style type="text/css">
body  { background-color:#000;color:#FFF; }
#hgr  { width:800;height:480;position:absolute;top:0;left:0; }
#logo { width:688;height:226;position:absolute;top:146px;left:56px; }
</style>
</head>

<body>
<div id="hgr"></div>
<div id="logo"></div>

<script type="text/javascript">
function fader(wert) {
	
	var i = wert;
	if(i > 1) { 
		var h = document.getElementById("hgr"); 
		h.style.opacity = "0."+i;
		i = i - 1;
		setTimeout("fader("+i+")",100); 
	}	
}
window.onload = fader(99)
</script>

</body>
</html>

Fragen zu diesem Tipp? In unserem Webmaster-Forum helfen wir weiter!

Das könnte Sie auch interessieren:

Ähnliche Fragen:

» Top Tipps: Diese Tipps sind heute beliebt

datenschutz (41x gelesen)
windows-beschleunigen (40x gelesen)
windows-defragmentieren-und-aufraeumen (35x gelesen)
windows-geschwindigkeits-einstellungen (33x gelesen)
pc-einsteigerkurs (30x gelesen)

Passende Wörter im Lexikon:

Javascript
JavaScript ist eine weit verbreitete Skriptsprache, die ursprünglich von Netscape für das DOM-Scripting für Webseiten entwickelt wurde. Sie hat sich seitde...

Browser
Der Browser oder Webbrowser ist das Programm, dass die HTML - Befehle einer Internetseite mit Bildern, Videos und Texten auf dem Bildschirm anzeigt. Der Browser ist also ...

Webbrowser
Siehe auch Browser. ...

Browser Verlauf

Mehr Tipps zu Lösung: Javascript – TypeErro...

Webseiten-Titel ändern oder animieren mit JavaScript (mehr Aufmerksamkeit bei Tabs!)
Der Webseiten-Titel wurde früher in der Titelleiste des Browsers angezeigt: Mittlerweile sieht man den Text oft nur noch bei mehreren geöffneten Tabs. Für Besucher, die...
Javascript Array leeren – so geht’s!
Ein Array ist eine spezielle Form einer Variable, die gleich mehrere Inhalte aufnehmen und einzeln wieder abrufen kann. Sie lässt sich nicht nur einfach anlegen...
UnBounce Editor: Mit JavaScript zwischen Mobile und Desktop unterscheiden
UnBounce ist ein praktischer, aber oft wenig flexibler Editor für einfache Webseiten und Landingpages: Damit lassen sich einzelne Seiten mit wenig Aufwand zusammenklicken und anschließend...
PHP Fehler anzeigen: Fehleranzeige aktivieren für eine oder alle Seiten!
Schnell sehen, wo der PHP Fehler liegt: Dazu schaltet man die PHP Fehleranzeige ein, um genaue Informationen zu Problem und Zeilennummer zu bekommen. Die PHP...
CHKDSK unter Windows starten (Fehler: Zugriff verweigert)
Wer das in Windows integrierte Festplatten-Diagnosetool CHKDSK ("Check Disk") in einer normalen Eingabeaufforderung aufrufen möchte, bekommt unter Umständen eine Fehlermeldung: Windows beschwert sich, dass der...
MacBook Touch-Bar aus oder reagiert nicht: Lösung!
Apple hatte bei einigen MacBook Modellen die obere Tasten-Leiste gegen einen kleinen Touch-Screen getauscht: Die TouchBar. Sie ließ sich je nach App personalisieren, nervte die...