JS-Komponenten am Ende von HTML oder "onload" initialisieren?

Question

Eine Weile lang hatte ich JavaScript-Komponenteninitialisierung ausgeführt, indem ich darauf wartete, dass das "onload" -Ereignis ausgelöst wurde und main() in der Art ausgeführt wurde. Es schien sauberer und Sie konnten sicher sein, dass der ID-Status Ihres DOM in Ordnung war. Aber nach einiger Zeit des Durchprobierens stellte ich fest, dass die Initialisierung der Komponente durch irgendeine Art von Ressource unterbrochen wurde, die während des Ladens anhielt (Bilder, CSS, Iframes, Flash, etc.).

Jetzt habe ich den Initialisierungsaufruf an das Ende des HTML-Dokuments selbst unter Verwendung von inline <script /> Ausführung verschoben und festgestellt, dass es die Initialisierung vor anderen externen Ressourcen schiebt.

Jetzt frage ich mich, ob es einige Fallstricke gibt, die damit kommen, anstatt auf das "Onload" zu warten.

Welche Methode verwenden Sie?

BEARBEITEN: Danke. Es scheint, dass jede Bibliothek eine spezielle Funktion für Implementierungsunterschiede hat. Ich benutze Prototyp, also this ist was ich brauchte.

Answer 1

Für mich verwenden wir jquery und sein Dokument bereit Zustand stellt sicher, dass das DOM ist geladen, wartet aber nicht auf Ressourcen wie du sagst. Sie können natürlich zu diesem ohne ein Javascript-Framework, es erfordert eine Funktion, die Sie zum Beispiel erstellen können: document ready Nun, zum größten Teil setzen Skript am Ende der Seite sicher, dass der Rest der Seite da ist, aber dafür sorgen Das DOM ist fertig ist nie eine schlechte Sache.

Answer 2

JQuery hat $ (document) .ready()

Der ideale Punkt, an dem die meisten Skripte auszuführen, wenn das Dokument fertig ist, und nicht unbedingt, wenn sie „geladen“ ist.

See here

Answer 3

ich weder verwenden. Stattdessen bin ich auf YUI's onDomReady() (oder onContentReady()/onAvailable()) angewiesen, weil es das Timing der Initialisierung für mich behandelt.

(Andere JS Bibliotheken haben ähnliche Methoden für die Ausführung nur einmal die Seite vollständig geladen ist, wie dies ein weit verbreitetes JS Problem.)

Answer 4

Das entspricht nicht (X) HTML-Spezifikation und ich würde davon abgeraten werden. Es würde Ihre Seite in einen Eigenschaftsmodus des Browsers bringen.

Answer 5

Der richtige Weg um das Problem wäre die Verwendung des Ereignisses DOMContentLoaded, das nicht in allen Browsern unterstützt wird. Es gibt Hacks (zB Polling doScroll() oder onreadystatechange), so dass Bibliotheken diese Funktionalität browserübergreifend bereitstellen können.

Aber es gibt immer noch Probleme mit DOMContentLoaded und chunked Transfers, die nicht von gängigen JavaScript-Frameworks angesprochen wurden.

Hier ist my take on the issue.