Manlikeakins JavaScript-Challenge, Tag 93: DOM: DOMContentLoaded.

Wow ... wir beenden diese Herausforderung nächste Woche um diese Zeit!

DOMContentLoaded  wird ausgelöst  , wenn der DOM-Inhalt geladen wird, ohne darauf zu warten, dass Bilder und Stylesheets vollständig geladen sind.

Sie müssen das  Ereignis DOMContentLoaded behandeln, wenn Sie das JavaScript im Kopf der Seite platzieren, aber Elemente im Hauptteil referenzieren, zum Beispiel:

In diesem Beispiel referenzieren wir die Schaltfläche im  Body  vom JavaScript im  Head .

Da das DOM nicht geladen wurde, wenn die JavaScript-Engine das JavaScript im Kopf analysiert, existiert die Schaltfläche mit der ID btn nicht.

Um dies zu beheben, platzieren Sie den Code wie folgt in einem  DOMContentLoaded -  Ereignishandler:

Wenn Sie JavaScript in den Header einfügen, führt dies zu Engpässen und Rendering-Verzögerungen, daher ist es besser, das Skript vor das  </body>-Tag zu verschieben . In diesem Fall müssen Sie den Code nicht wie folgt in das  DOMContentLoaded-  Ereignis einfügen:

Zusammenfassung

Das  DOMContentLoaded-  Ereignis wird ausgelöst, wenn der DOM-Inhalt geladen wird, ohne darauf zu warten, dass Bilder und Stylesheets vollständig geladen sind.

Behandeln Sie das DOMContentLoaded- Ereignis nur,   wenn Sie den JavaScript-Code im Head platzieren, der auf Elemente im Body-Abschnitt verweist.

Danke fürs Lesen!