Heim  >  Artikel  >  Web-Frontend  >  Wie ersetzt man $(document).ready() in einer jQuery-freien Welt?

Wie ersetzt man $(document).ready() in einer jQuery-freien Welt?

Linda Hamilton
Linda HamiltonOriginal
2024-11-05 21:44:02324Durchsuche

How to Replace $(document).ready() in a jQuery-Free World?

Enthüllung der Nicht-jQuery-Alternative: Äquivalente für $(document).ready()

Wenn Sie ohne die robusten Funktionen von jQuery in Webentwicklungsvorhaben einsteigen, ist dies von entscheidender Bedeutung alternative Methoden zur Erzielung ähnlicher Ergebnisse zu erkunden. Ein solches Szenario entsteht, wenn man nach einem Äquivalent für die weit verbreitete Funktion $(document).ready() sucht.

Für Browser, die den ECMA-Standards entsprechen, bietet das folgende Snippet einen nahtlosen Ersatz:

document.addEventListener("DOMContentLoaded", function() {
  // Code goes here
});

Dieses Skript löst die Ausführung bestimmter Codeblöcke aus, sobald der Document Object Model (DOM)-Baum geladen ist. Es überwacht ausschließlich die DOM-Struktur, ausgenommen externe Assets wie Bilder und Stylesheets.

Unterschied von window.onload

Es ist erwähnenswert, dass window.onload keine bereitstellt Äquivalente Funktionalität wie $(document).ready() von JQuery. Während window.onload darauf wartet, dass alle Ressourcen, einschließlich externer Assets, vollständig geladen sind, bevor der Code ausgeführt wird, erkennt $(document).ready() lediglich die Verfügbarkeit des DOM. Dieser subtile Unterschied kann sich auf das Anwendungsverhalten auswirken, insbesondere in Situationen, in denen das Laden externer Ressourcen zu Leistungsverzögerungen führen kann.

Kompatibilität mit IE8 und älteren Browsern

Um die Kompatibilität mit IE8 und älter sicherzustellen Für Browser bietet das folgende Code-Snippet eine alternative Option:

document.onreadystatechange = function () {
    if (document.readyState == "interactive") {
        // Code goes here
    }
}

Dieses Skript basiert auf dem onreadystatechange-Ereignis und prüft, ob ein „interaktives“ Dokument bereit ist, um die Codeausführung zu initiieren.

Das obige ist der detaillierte Inhalt vonWie ersetzt man $(document).ready() in einer jQuery-freien Welt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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