Document.isReady: Eine native Lösung für die DOM-Ready-Erkennung

Abhängigkeit von Frameworks wie Prototype und jQuery für die Verwaltung von window.onload-Ereignissen möglicherweise nicht immer begehrenswert sein. In diesem Artikel werden alternative Methoden zur Bestimmung der DOM-Bereitschaft untersucht, insbesondere durch die Verwendung von document.isReady.

Abfragen von Document.isReady

Für moderne Browser mit stabilen Ereignis-APIs ist die Das DOMContentLoaded-Ereignis bietet eine robuste Methode zur Behandlung von DOM-Ready-Ereignissen. Implementierungen wie die folgenden bieten eine einfache und effiziente Lösung:

function fireOnReady() { /* ... */ }
if (document.readyState === 'complete') {
    fireOnReady();
} else {
    document.addEventListener("DOMContentLoaded", fireOnReady);
}

jQuerys $.isReady-Eigenschaft

jQuery bietet eine undokumentierte Eigenschaft, $.isReady, die den DOM-Bereitschaftsstatus intern widerspiegelt. Die Verwendung dieser Eigenschaft ermöglicht präzise Prüfungen:

if($.isReady) {
    // DOM is ready
} else {
    // DOM is not yet ready
}

Es ist wichtig zu beachten, dass diese Eigenschaft weiterhin undokumentiert ist und ihre Verfügbarkeit in zukünftigen jQuery-Versionen nicht garantiert werden kann. Verwenden Sie es mit Vorsicht und seien Sie auf mögliche Änderungen bei Upgrades vorbereitet.

Ein benutzerdefiniertes DOM-fähiges Snippet

Für eine breitere Browserkompatibilität kann ein benutzerdefiniertes DOM-fähiges Snippet verwendet werden. Inspiriert durch den Ansatz von Dustin Diaz überprüft es den document.readyState mithilfe eines regulären Ausdrucks:

if( !/in/.test(document.readyState) ) {
    // document is ready
} else {
    // document is NOT ready
}

Diese Methode basiert auf der Tatsache, dass der „in“-Teilstring in den Bereitschaftszuständen „Laden“ und „Interaktiv“ vorhanden ist, jedoch nicht im Zustand „vollständig“.