Wann ist das DOM in JavaScript bereit?

DOM-Bereitschaft in JavaScript verstehen

Bei der Arbeit mit dynamischen Webseiten ist das Verständnis der DOM-Bereitschaft entscheidend, um Aufgaben zum richtigen Zeitpunkt auszuführen. Während Frameworks wie Prototype und jQuery praktische Mechanismen zum Anhängen von Funktionen an das window.onload-Ereignis bieten, gibt es Situationen, in denen ein direkterer Ansatz wünschenswert ist.

Abfragen der DOM-Bereitschaft

Wenn Sie nach einer Alternative zur Verwendung von Frameworks suchen, können Sie einige Methoden ausprobieren:

1. Die undokumentierte „isReady“-Eigenschaft von jQuery:

Obwohl jQuery nicht dokumentiert ist, verwaltet es eine interne Eigenschaft namens isReady. Wenn darauf zugegriffen werden kann, zeigt es an, ob das DOM-Ready-Ereignis ausgelöst wurde:

<code class="javascript">if ($.isReady) {
  // DOM is ready
} else {
  // DOM is not yet ready
}</code>

Obwohl dieser Ansatz über mehrere jQuery-Versionen hinweg stabil war, bleibt er undokumentiert und sollte mit Vorsicht verwendet werden.

2. Document ReadyState:

Das Dokumentobjekt bietet eine readyState-Eigenschaft, die den Ladestatus der Seite widerspiegelt:

<code class="javascript">if (document.readyState === 'complete') {
  // DOM is ready
} else {
  document.addEventListener("DOMContentLoaded", fireOnReady);
}</code>

Indem Sie auf das DOMContentLoaded-Ereignis warten, können Sie Code ausführen, wenn das Seite ist vollständig geladen.

3. Benutzerdefinierte DOM-Ready-Prüfung:

Für Szenarien, in denen die Browserkompatibilität von größter Bedeutung ist, können Sie eine benutzerdefinierte DOM-Ready-Prüfung erstellen, die vom Snippet von Dustin Diaz inspiriert ist:

<code class="javascript">if (!/in/.test(document.readyState)) {
  // document is ready
} else {
  // document is NOT ready
}</code>

Dieser Ansatz nutzt diese Tatsache dass die Ladezustände „loading“ und „interactive“ in ihrer readyState-Eigenschaft den String „in“ enthalten. Wenn also „in“ im readyState gefunden wird, ist das Dokument noch nicht fertig.

Das obige ist der detaillierte Inhalt vonWann ist das DOM in JavaScript bereit?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!