Kann ich Javascript ausführen, bevor die ganze Seite geladen ist?

Ich möchte ein wenig Javascript ausführen, bevor die ganze Seite geladen wurde. Ist das möglich? Oder beginnt der Code unter </html>?Kann ich Javascript ausführen, bevor die ganze Seite geladen ist?

Quelle

2010-05-27 picknick

mögliche Duplikate von [Wie kann ich JavaScript-Funktion vor dem Laden der Seite ausführen?] (Http://stackoverflow.com/questions/885909/how-can-i-execute-jascript-function-before-page-load) – miku

Ich denke nicht, dass das ein Duplikat ist - es ist eher eine Server-Client-Kommunikationsfrage. – scunliffe

135

Nicht nur können Sie, aber Sie müssen besondere Anstrengungen machen nicht zu, wenn Sie nicht wollen. :-)

Wenn der Browser beim Analysieren des HTML-Codes auf einen script-Tag stößt, hört er auf zu analysieren und übergibt den Javascript-Interpreter, der das Skript ausführt. Erst wenn das Skript abgeschlossen ist, führt der Browser die Analyse der Seite fort (weil das Skript möglicherweise document.write Aufrufe ausführt, um Markup auszugeben, das der Parser verarbeiten sollte). Dies ist das Standardverhalten. Es gibt script Tag-Attribute, die dies verhindern können (defer and async).

dies so betrachten:

<!DOCTYPE HTML> 
<html><head><!-- yada yada yada --></head> 
<body> 
<p>Line 1</p> 
<script type='text/javascript'> 
    alert("Stop that parsing!"); 
</script> 
<p>Line two</p> 
</body> 
</html>

Wenn Sie die Seite laden, werden Sie den „Linie 1“ Absatz sehen, während die Warnung angezeigt wird, und die der „Linie 2“ Absatz erscheint, nachdem es fertig ist.

Wo es etwas knifflig wird, ist die Interaktion mit dem DOM, da das DOM vom Parser aufgebaut wird, da es seine Sache macht und Ihr Skript läuft, bevor das DOM komplett manipulierbar ist. Wenn Sie nur auf Elemente zugreifen, die dem Tag script in der Datei vorangestellt sind, sind Sie in Ordnung, aber um sicher zu gehen, sollten Sie alle DOM-Interaktionen verschieben, bis das DOM vollständig erstellt ist.

Aber in den meisten Fällen können Sie glücklich auf die früheren Elemente zugreifen. Bedenken Sie:

<!DOCTYPE HTML> 
<html><head><!-- yada yada yada --></head> 
<body> 
<p id='p1'>Line 1</p> 
<script type='text/javascript'> 
    document.write("<p>p1 is null? " + (document.getElementById('p1') == null ? "yes" : "no") + "</p>"); 
    document.write("<p>p2 is null? " + (document.getElementById('p2') == null ? "yes" : "no") + "</p>"); 
</script> 
<p id='p2'>Line two</p> 
</body> 
</html>

Der Ausgang Sie sehen, ist:

Line 1 
p1 is null? false 
p2 is null? true 
Line 2

... weil p1 existiert, ab wann das Skript ausgeführt wird, aber p2 nicht.

~~Ich habe keinen Link zur Hand hat, aber~~In this message, die Entwickler des Google Closure Library sagen, dass sie keinen großen Wert auf die „ready“ Stil Ereignisse nicht sehen, dass Prototype, jQuery, ExtJS, Dojo und die meisten anderen bieten, denn wenn Sie das Skript nach den Elementen einfügen, mit denen Sie interagieren möchten, geht es Ihnen gut. was im Einklang mit YUI's recommendation, dass Sie nur Ihre Skripte direkt vor dem schließenden </html> Tag (da müssen Sie sie irgendwo schließlich, und dort unten halten sie nicht halten Sie Ihre Seite anzuzeigen). Nun, persönlich, ich sehe in diesen Ereignissen einen gewissen Wert, obwohl ich denke, dass sie überbeansprucht sind, aber mein Punkt ist, dass Sie ganz klar anfangen können, sehr früh mit den Dingen zu interagieren.

Quelle

2010-05-27 10:16:43

Große Antwort. Vielen Dank. – picknick

Oder Sie können die Ereignisdelegierung verwenden und Ihre Handler einrichten, bevor die Seite geladen wurde, um eine reaktionsfähigere Oberfläche zu erhalten. Hier ist ein schöner Artikel darüber: [Lassen Sie sich nicht von jQuery $ (document) .ready() verlangsamen] (http://encosia.com/2010/08/18/dont-let-jquerys-document-ready -slow-you-down /) – Tgr

Kann man mit Javascript einen Wert ersetzen (zB "Line 1" in "Hallo Welt" ändern), bevor der Browser p1 rendert? Was ich damit sagen will, ist, dass ich nicht möchte, dass der Bildschirm flackert, wenn ich den Wert von p1 ersetze. Ich möchte den Wert/den Text von p1 durch Javascript ersetzen, bevor der Benutzer sogar p1 (und p2 und andere Elemente) sehen kann. Ist das möglich? – n00b

-4

Ich denke, Sie erhalten einen Fehler, wenn Sie versuchen, auf ein Steuerelement im BODY verweisen, bevor die ganze Seite geladen wird.

Quelle

2010-05-27 10:10:26 Raj

Sie können Javascript jederzeit ausführen. AFAIK es wird in dem Moment ausgeführt, in dem der Browser das <Skript> Tag erreicht, wo es ist. Aber Sie können nicht auf Elemente zugreifen, die noch nicht geladen sind.

Wenn Sie also auf Elemente zugreifen müssen, sollten Sie warten, bis das DOM geladen ist (das bedeutet nicht, dass die ganze Seite geladen ist, einschließlich Bilder und Zeug.Es ist nur die Struktur des Dokuments, die viel früher geladen wird, so dass Sie normalerweise keine Verzögerung bemerken), indem Sie das DOMContentLoaded Ereignis oder Funktionen wie $.ready in jQuery verwenden.

Quelle

2010-05-27 10:17:44 Marian

Das DOMContentLoaded-Ereignis wird ausgelöst, sobald die DOM-Hierarchie vollständig erstellt wurde. Frames sind fertig geladen. – BeauCielBleu

Sie haben absolut Recht, ich habe es behoben. Merci :) – Marian

Kann ich Javascript ausführen, bevor die ganze Seite geladen ist?

Antwort

Verwandte Themen