nicht angemeldet
OrlokHallo Camping_RIDER
Warum eigentlich body onload noch ins HTML und nicht direkt ein
body.addEventListener('load', ...)?
Diese Variante würde nicht funktionieren, denn das body-Element hat kein load-Event.
Aus historischen Gründen führt eine Handler-Registrierung über das Attribut onload auf dem body-Element tatsächlich dazu, dass der Handler auf window registriert wird, wo es ein entsprechendes Event gibt. Bei Verwendung der moderneren Methode addEventListener passiert das hingegen nicht.
const handler = _ => {}
document.body.onload = handler
console.log(document.body.onload === window.onload) // true
Die Eigenschaft body.onload reflektiert window.onload und umgekehrt. Das heißt, eine Zuweisung an eine der Eigenschaften überschreibt immer auch den Wert der jeweils anderen Eigenschaft. Und eine spätere Zuweisung an eine der beiden Eigenschaften überschreibt eine vorangegangene Registrierung über das onload-Attribut im Markup.
<body onload="console.log(1)">
<script>
window.onload = _ => console.log(2)
</script>
</body>
</html>
Hier wird nur 2 in die Konsole geschrieben, da in beiden Fällen ein Handler für die Eigenschaft window.onload registriert wird, und das Skript die Registrierung des anonymen Handlers im Markup überschreibt.
Soll aus einem Skript heraus das globale load-Event überwacht werden (und nicht das meist besser geeignete Event DOMContentLoaded), dann muss die Registrierung auf dem window-Objekt erfolgen, wenn dafür die zu Recht empfohlene Methode addEventListener verwendet werden soll.
window.addEventListener('load', event => /* ... */)
// oder
addEventListener('load', event => /* ... */)
Die explizite Referenz auf window kann weggelassen werden, da addEventListener als Eigenschaft des globalen Objekts auch direkt angesprochen werden kann. Die Bindung an window als Kontextobjekt erfolgt hier automatisch.
Viele Grüße,
Orlok
TS
Der Martin
Camping_RIDER
marctrix
JürgenB
Gunnar Bittersmann
Matthias Apsel
Matthias Scharwies