mehrere $ (Dokument) .ready und $ (Fenster) .load in $ (Dokument) .ready

Ich habe 2 Fragen. Zuallererst ist das nicht meine Arbeit. Ich schaue mir gerade die JavaScript-Dateien anderer an. Ich kann den genauen Code nicht angeben, aber ich kann zeigen, was ich mich wundere. In den JavaScript-Dateien sehe ich viele . Ich weiß, was $(document).ready tut, wird die Callback-Funktion aufgerufen, wenn der DOM-Baum geladen ist. Gibt es einen Grund, warum jemand mehr als einen Callback $(document).ready verwenden würde? Ich verstehe den Punkt nicht.

Auch ich noch etwas sah, war ein $(window).load in einem $(document).ready, wie folgt aus:

$(document).ready(function() { 
    $(window).load(function() { 
     //... 
    }); 
});

Von dem, was ich weiß, $(window).load() aufgerufen wird, wenn alles von einer Seite geladen wird, wie Vermögenswerte und Bilder usw. I würde denken, $(window).load() ist das letzte, was nach $(document).ready genannt wird. Gibt es eine Zeit, wo $(window).load BEFORE $(document).ready heißt und gibt es einen Grund, warum Sie eine $(window).load in eine $(document).ready setzen?

Quelle

2017-02-20 Joshua Bakker

sieht aus wie es von jemandem geschrieben wurde, der nicht wusste, was sie taten – Pete

Es war ein Auszubildender AFAIK, aber ich habe keine Ahnung, wer es geschrieben hat. Es wurde geschrieben, als ich wieder in der Schule war, also habe ich keine Ahnung. Aber ja, sieht so aus, aber ich möchte nur 100% sicher sein. –

@Joshua Bakker, was Sie in Bezug auf $ (Dokument) .Write und $ (Fenster) geschrieben haben.load() ist perfectibly acceptib, und es ist richtig, dass es von jemandem geschrieben wurde, der keine Ahnung hatte, was los ist. –

Ja, jQuery gewährt, dass ready Ereignis vor load aufgerufen wird. Sogar in IE8- (wo DOMContentLoaded nicht unterstützt wird) funktioniert es auf diese Weise. Aber lassen Sie uns auf den folgenden Code aussehen:

<!doctype html> 

<title>Ready vs load test</title> 

<style>body {white-space: pre}</style> 

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 

<script> 
    ~function() { 
    function log(msg) { 
     document.body.innerHTML += msg + "\n"; 
    } 

    function handler(msg) { 
     return function() { 
     log(msg); 
     } 
    } 

    $(window).load(handler("5. load #1")); 
    $(document).ready(handler("1. ready #2")); 
    $(window).load(handler("6. load #3")); 
    $(document).ready(handler("2. ready #4")); 
    $(document).ready(function() { 
     log("3. ready #5"); 
     $(window).load(handler("8. load #6")); 
    }); 
    $(document).ready(handler("4. ready #7")); 
    $(window).load(handler("7. load #8")); 
    }(); 
</script>

Das Ergebnis ist

1. ready #2 
2. ready #4 
3. ready #5 
4. ready #7 
5. load #1 
6. load #3 
7. load #8 
8. load #6

Blick auf Linien 7 und 8. Die load von ready Ereignis verbunden umgegangen wird die letzte. Auf diese Weise können wir sicherstellen, dass alle zuvor hinzugefügten (während der Skriptsanalyse und -expression) load Handler bereits aufgerufen wurden.

mit so $(window).load außerhalb der $(document).ready und innen ändert sich nicht so viel aus, wie es wie Sachen Arbeit auswirken würde?

Tatsächlich kann es Skriptausführung beeinflussen. Die erste Version arbeitet und die zweite nicht:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<script> 
 
    $(document).ready(function() { 
 
    $(window).load(function() { 
 
     $.magic.value = 12; 
 
    }); 
 
    }); 
 
</script> 
 

 
<script> 
 
    $(window).load(function() { 
 
    $.magic = {}; 
 
    }); 
 
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<script> 
 
    $(document).ready(function() { 
 
    }); 
 

 
    $(window).load(function() { 
 
    $.magic.value = 12; 
 
    }); 
 
</script> 
 

 
<script> 
 
    $(window).load(function() { 
 
    $.magic = {}; 
 
    }); 
 
</script>

Quelle

2017-02-20 09:59:29 Qwertiy

Die Frage ist, ob Sie IE8 wirklich noch betrachten müssen. Ich würde sagen, es ist einfach zu aktualisieren und die Leute sollten. –

@JoshuaBakker, habe ich den Unterschied gefunden. Gib mir eine Minute, um eine Antwort zu aktualisieren. – Qwertiy

@JoshuaBakker, aktualisierte eine Antwort. – Qwertiy

$ (document) .ready startet, wenn alle Knoten des DOM geladen wurden, aber nicht unbedingt deren Inhalt, das ist, was $ (window) .load für z. ein img-ele kann vorhanden sein, aber es ist Inhalt - das Bild - wurde nicht geladen.

Sie haben also Recht, verwenden Sie jeden Listener nur einmal und verschachteln Sie sie nicht.

Quelle

2017-02-20 09:58:17 fmue

Ich weiß das. Aber ich wollte nur sicherstellen, dass meine Aussage über dieses '$ (window) .load' nicht BEFORE' $ (document) .ready' genannt wird. –

mehrere $ (Dokument) .ready und $ (Fenster) .load in $ (Dokument) .ready

Antwort

Verwandte Themen