Bestellung von $(document).load() und $(document).ready (), wenn das zurückstellen der laden von js

Bevor ich alles ändern mein code, ich will einfach nur, um zu überprüfen, dass ich muss.

Ich habe mehrere inline-js und jquery-Funktionen, die in der ready () - Funktion:

$(document).ready(function(){ do_something(); ...

Viele dieser Funktionen verlassen sich auf andere Funktionen, die enthalten sind in einer externen js-Dokument. Sie verwenden auch definierten Klassen im externen Stylesheet.

Nun ich habe gerade das laden meiner externen js und css, so dass es verzögert wird (wie von Google empfohlen https://developers.google.com/speed/docs/best-practices/payload?hl=en#DeferLoadingJS):

 if (window.addEventListener)
    window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
    window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

Diese Weise ist die Seite vollständig gerendert, einschließlich aller Bilder, bevor es beginnt zu laden Sie die JS.

Diese funktioniert einwandfrei. Allerdings Frage ich mich, warum und ob es immer. Nicht $(document).ready() ausgeführt, bevor onLoad? Nicht ich Risiken nicht die erforderlichen Funktionen definiert, wenn $(document).bereit durchgeführt wird?

So, muss ich Wechsel alle $(document).ready, $(document).load()? Oder zumindest einige von Ihnen? Aber dann die onLoad() wird zuerst ausgeführt? Die eine, die Lasten der externen js (die im header definiert) oder der inline? was verliere ich durch den Wechsel bereit zum laden? Könnte ich, zum Beispiel, das Risiko, dass ein Ereignis nicht an ein element klickt ein Benutzer auf das element?

Btw, die jquery-api ist nicht aufgeschoben, denn das verursacht Probleme, wenn ich ging zum ausführen von anderem code.

InformationsquelleAutor user984003 | 2013-01-06

  1. 6

    Versuchen Sie es mit

     $(window).load(function(){
 dosomething();
 });

    Es laufen wird, die js-nachdem die ganze Seite geladen ist.

    Vermeiden Sie die Verwendung

    $(document).ready(function(){
 dosomething();
 });

    Es laufen wird, die js nur nach dem laden des DOM.

    InformationsquelleAutor Chunky

  2. 2

    Die Reihenfolge der Ausführung ist wie folgt:

    1. ready() feuert, wenn das DOM (HTML) ist fertig und scripts geladen werden.
    2. load() feuert, wenn alles andere fertig geladen: HTML -, Scripts -
      CSS, Bilder

    Als Allgemeine Regel gilt, legen Sie alle Skripten, die außerhalb der bereit und laden von Prozeduren, also Funktionen, die geladen sind, von der Zeit bekommen Sie genannt.
    Dann halten alle Ereignis-Listener innerhalb der ready-handler und rufen Sie keine Funktionen auf Nachfrage.

    Den high-level-JS-Struktur sieht wie folgt aus:

    1. jQuery-Bibliothek
    2. Plugins/Third-party scripts
    3. Benutzerdefinierte Skripts
    4. $(document).ready() Verpackung minimal JS Logik Zuhören für DOM-Veranstaltungen

    InformationsquelleAutor Oriol

Schreibe einen Kommentar