Heim > Web-Frontend > js-Tutorial > Wie kann ich die Funktionalität von $(document).ready() erreichen, ohne jQuery zu verwenden?

Wie kann ich die Funktionalität von $(document).ready() erreichen, ohne jQuery zu verwenden?

Susan Sarandon
Freigeben: 2024-11-06 07:06:02
Original
348 Leute haben es durchsucht

How Can I Achieve the Functionality of $(document).ready() Without Using jQuery?

Entspricht $(document).ready() ohne jQuery

Die Funktion $(document).ready() in jQuery ist eine Ereignishandler, der auf das Laden des DOM wartet, bevor er seinen Rückruf ausführt. Wenn Sie jQuery nicht verwenden, können Sie den gleichen Effekt mit dem folgenden Codeausschnitt erzielen:

document.addEventListener("DOMContentLoaded", function() {
  // code...
});
Nach dem Login kopieren

Diese Methode hängt einen Listener an das Ereignis „DOMContentLoaded“ an, das ausgelöst wird, wenn der DOM-Baum geöffnet wurde geladen (ausgenommen externe Assets wie Bilder).

Unterschiede zu window.onload

Es ist wichtig zu beachten, dass sich window.onload nicht genau wie $(document) verhält. .bereit(). Während window.onload darauf wartet, dass das DOM geladen wird und alle Elemente geladen werden, wartet $(document).ready() nur darauf, dass das DOM geladen wird. Dies kann wichtig sein, wenn Ihr Skript auf das Vorhandensein von DOM-Elementen angewiesen ist, insbesondere wenn Sie mit externen Ressourcen arbeiten.

IE8 und ältere Äquivalente

Für Browser älter als IE9 kann das folgende Code-Snippet verwendet werden:

document.onreadystatechange = function () {
    if (document.readyState == "interactive") {
        // Initialize your application or run some code.
    }
}
Nach dem Login kopieren

Dieser Code prüft den „interaktiven“ Status des Dokuments, der anzeigt, dass der DOM-Baum geladen wurde, externe Ressourcen jedoch möglicherweise noch geladen werden.

Das obige ist der detaillierte Inhalt vonWie kann ich die Funktionalität von $(document).ready() erreichen, ohne jQuery zu verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage