2017-06-09 4 views
0

Warum führt dies zu einem leeren Bildschirm?HTML leeren Bildschirm

01_using_javascript.html:

<!DOCTYPE html> 
    <html> 
    <head> 
     <title> Test </title> 
     <script src="01_using_javascript.js"> </script> 
    </head> 

    <body> 
     <p id="demo"></p> 
    </body> 
    </html> 

01_using_javascript.js:

document.getElementById("demo").innerHTML = Hi; 
+0

Kontrolle der Entwickler-Tools-Konsole für Fehlermeldungen in Bezug auf 'undefined' nicht mit einer Eigenschaft, genannt' innerHTML' - das ** Entwickler ** Tools-Konsole (normalerweise F12 auf der Tastatur) sollte Ihre erste Debugging-Allee sein –

+1

Setzen Sie "Hi" in Anführungszeichen; Ihr Skript behandelt 'Hi' als eine (leere) Variable. –

+0

@JaromandaX F12 gibt mir Inspect Element (ich benutze Google Chrome). – user604803

Antwort

3

Nicht nur Sie Hi mit Zitaten wickeln, aber Sie müssen auch für die DOM warten, um die Elemente zu laden Sie möchten ändern. Entweder Sie setzen den script Tag nach dem p Elemente, oder Sie verwenden window.onload Ereignis, etwa so:

window.onload = function() { 
    document.getElementById("demo").innerHTML = "Hi"; 
} 
2

Ändern Sie die Zeile in 01_using_javascript.js zu document.getElementById("demo").innerHTML = "Hi";. Der Browser erkennt Hi selbst nicht.

3

In Anführungszeichen in die Zeichenfolge eingefügt werden soll:

document.getElementById("demo").innerHTML = "Hi";
<!DOCTYPE html> 
 
    <html> 
 
    <head> 
 
     <title> Test </title> 
 
     <script src="01_using_javascript.js"> </script> 
 
    </head> 
 

 
    <body> 
 
     <p id="demo"></p> 
 
    </body> 
 
    </html>

Verwandte Themen