Warum ist ein DOM-Element null?

Ich habe diese einfache HTML-Datei:Warum ist ein DOM-Element null?

<!DOCTYPE html> 
<html> 
<head> 
    <script src='test.js'></script> 
</head> 

<body> 
    <p>I am a paragraph tag</p> 
    <h1 >I am an h1 tag</h1> 
    <div id="id"> I am a div tag</div> 
</body>

Und diesen einfachen Skript (test.js):

y=document.getElementById("id"); 
y.style.color="green";

auf der Erde Warum ist "y" null? Der Fehler Ich erhalte ist

TypeError: y is null

Ich bin sicher, dies ist eine einfache Syntax, was mir fehlt, aber ich kann für das Leben von mir nicht, es herauszufinden! Hilfe!

PostScript: Sowohl die HTML-Datei als auch die Datei test.js befinden sich im selben Ordner.

Quelle

2016-06-15 Mr. Chameleon

Diese Frage wird mehrmals täglich gestellt. Versuchen Sie in der Zukunft, die Frage zu recherchieren, bevor Sie fragen :) – 4castle

Sie sollten Ihre Variablen mit der var-Syntax deklarieren, z. var y = document ... "Zuletzt wird Ihr Javascript ausgeführt, bevor das Element in dom geladen wurde. Möglicherweise können Sie es reparieren, indem Sie Ihr Javascript in (function() {}); –

@ zeros-and- eine, die es zu einer lokalen Variable macht –

Sie haben das Skript am Ende des Dokuments platzieren, wenn alle Elemente erstellt werden:

<!DOCTYPE html> 
<html> 
<head> 

</head> 

<body> 
    <p>I am a paragraph tag</p> 
    <h1 >I am an h1 tag</h1> 
    <div id="id"> I am a div tag</div> 
</body> 
<script src='test.js'></script>

Quelle

2016-06-15 22:24:07 CMPS

Hmmm ... das ist komisch, es funktioniert, aber ich musste es vorher nie machen, ich vermute, das ist der Grund, warum ich es sonst mit einem Event-Handler hatte, damit es nicht läuft, sobald das Dokument geladen wird. –

Korrekt, wenn Sie es an der Spitze setzen möchten, können Sie 'window.onload' verwenden – CMPS

Sie können den Inhalt auf Ihrem Skript wickeln $ (document) mit .ready wenn Sie jQuery verwenden oder window.onload bei Verwendung von plain javascript.

Quelle

2016-06-15 22:26:39

Ich glaube nicht, dass OP [Tag: jQuery] verwendet – andlrc

@Hector Barbossa das ist das Singular LARGS + EST PROBLEM mit Stackoverflow ,, Leute wie Sie, die sich entscheiden, "lassen Sie es fallen und versuchen Sie jQ sehr! "Wenn die Frage * nicht mit jQuery * markiert ist, dann antworte nicht mit jQuery *. –

Tut mir leid, mein Fehler .. Ich habe die Tags nicht vorher überprüft, aber ich habe auch eine einfache JavaScript-Lösung angegeben –

Antwort

Verwandte Themen