Sofern Sie nichts anderes angeben, wartet der Javascript-Code nicht, bis die Seite geladen ist, bevor er ausgeführt wird. Eine Webseite enthält beispielsweise den folgenden HTML-Code:
Kopieren Sie den Codecode wie folgt:
<div id="ele">Willkommen bei www.VeVB.COm</div>
Wenn Sie vor dieser HTML-Codezeile den folgenden Javascript-Code hinzufügen:
Kopieren Sie den Codecode wie folgt:
<script type="text/javascript">
document.getElementById('ele').innerHTML= 'Willkommen in meinem Blog';
</script>
Führen Sie die Seite aus und Sie erhalten die Fehlermeldung: „document.getElementById('ele') ist null.“ Der Grund dafür ist, dass beim Ausführen des obigen Javascripts kein DOM-Element mit der ID „ele“ auf der Seite vorhanden ist.
Es gibt zwei Lösungen:
1. Platzieren Sie den Javascript-Code nach dem HTML-Code:
Kopieren Sie den Codecode wie folgt:
<div id="ele">Willkommen bei www.VeVB.COm</div>
<script type="text/javascript">
document.getElementById('ele').innerHTML='Willkommen in meinem Blog';
</script>
2. Warten Sie, bis die Webseite geladen ist, und führen Sie dann den Javascript-Code aus. Sie können die herkömmliche Lösung (Laden) verwenden: Fügen Sie zuerst den HTML-Körper und „<body load="load()">" hinzu und rufen Sie dann den obigen Javascript-Code in der Funktion „load()" auf. Worauf ich mich hier konzentrieren möchte, ist die Verwendung von jQuery, um Folgendes zu erreichen:
Kopieren Sie den Codecode wie folgt:
<Skript>
$(document).ready(function(){
document.getElementById('ele').innerHTML= 'Willkommen in meinem Blog';
});
</script>
// Da jQuery verwendet wird, ist es natürlich einfacher, es zu schreiben:
<Skript>
$(document).ready(function(){
$('#ele').html('Willkommen in meinem Blog'); //Die .text()-Methode ist auch hier verfügbar
});
</script>
Sie können den obigen jQuery-Code an einer beliebigen Stelle auf der Seite platzieren und er wartet immer, bis die Seite geladen ist, bevor er ausgeführt wird.