webentwicklung-frage-antwort-db.com.de

Unterschied zwischen onload () und $ .ready?

Können Sie den Unterschied zwischen den Funktionen onload() und $(document).ready(function(){..}) in using jQuery angeben? 

javascriptjqueryonload
51
Venkat

das load -Ereignis (a.k.a "onload") im Fenster- und/oder Body-Element wird ausgelöst, sobald all der Inhalt der Seite geladen wurde - dies umfasst alle Bilder, Skripts usw.

Im Gegensatz dazu verwendet die Funktion $(document).ready(...) von jquery einen browserspezifischen Mechanismus, um sicherzustellen, dass Ihr Handler so bald wie möglich aufgerufen wird, nachdem die HTML/XML-Domäne geladen wurde und auf sie zugegriffen werden kann. Dies ist der früheste Punkt im Seitenladeprozess, an dem Sie ein Skript sicher ausführen können, das auf Elemente in der HTML-Domäne der Seite zugreifen soll. Dieser Punkt kommt früher (oftmals viel früher) als das letzte load-Ereignis an, da zusätzliche Zeit erforderlich ist, um sekundäre Ressourcen (wie Bilder usw.) zu laden.

70
Lee

Die Hauptunterschiede zwischen den beiden sind:

  1. Das Ereignis Body.Onload () wird nur aufgerufen, nachdem das DOM und die zugehörigen Ressourcen wie Images geladen wurden. Das document.ready () -Ereignis von jQuery wird aufgerufen, sobald das DOM geladen wird, dh es wird nicht warten, bis die Ressourcen wie Images geladen werden . Daher werden die Funktionen im jQuery-ready -Ereignis ausgeführt, sobald die HTML-Struktur geladen ist, ohne auf die Ressourcen zu warten.
  2. Wir können mehrere document.ready () auf einer Seite haben, das Body.Onload () - Ereignis jedoch nicht.
18
Bhanu Prakash Pandey

Die Document.ready () - Funktion wird ausgelöst, sobald HTML DOM geladen wird. Die onload () - Funktion löst jedoch nach HTML DOM aus, wobei der gesamte Inhalt wie Bilder geladen werden.

2
user5755278

body.onload () kümmert sich sowohl um die HTML-Struktur als auch um die zugehörigen Ressourcen, während sich document.ready () nur um die HTML-Struktur kümmert.

1
sridiva

onload () wird ausgelöst, wenn der gesamte Inhalt (alles) des ausgewählten Elements vollständig geladen ist, z. B. CSS, Bilder usw.

$ .ready gibt an, dass der Code ausgeführt werden muss, sobald der Inhalt der Zielelemente geladen wurde und für die Bearbeitung durch das Skript bereit ist. Es wird nicht warten, bis die Bilder geladen werden, um das jQuery-Skript auszuführen.

.

Ex (Körperlast):

<body onload="loadBody()">

<script>
function myFunction() {
    alert("Page is loaded");
}
</script>
</body

Ex (onload auf ein Element):

<img src="w3html.gif" onload="loadImg()" width="100" height="132">

<script>
function loadImg() {
    alert("Image is loaded");
}
</script>

Ex3 ($ .ready):

<script type = "text/javascript">
        $(document).ready(function() {
            alert("$(document).ready fired");
        });
    </script>
0
Srikrushna Pal

Onload kümmert sich um DOM und Ressourcen: Es prüft, ob Bilder geladen sind, das Skript einsatzbereit ist und vieles mehr.

$ .ready prüfen Sie einfach, ob wir das vollständige DOM der Seite gelesen haben.

Bitte besuchen Sie diesen Link für weitere Erläuterungen und Beispiele: http://dailygit.com/difference-between-document-ready-and-window-load-in-jquery/

0
Daniele Petrarolo