HTMLElement: load-Ereignis
Das load-Ereignis wird für Elemente ausgelöst, die eine Ressource enthalten, wenn die Ressource erfolgreich geladen wurde. Derzeit umfasst die Liste der unterstützten HTML-Elemente: <body>, <embed>, <iframe>, <img>, <link>, <object>, <script>, <style> und <track>.
Hinweis:
Das load-Ereignis auf HTMLBodyElement ist tatsächlich ein Alias für das window.onload-Ereignis. Daher wird das load-Ereignis nur auf dem <body>-Element ausgelöst, sobald alle Ressourcen des Dokuments geladen oder fehlerhaft sind. Aus Gründen der Klarheit wird jedoch empfohlen, den Ereignis-Handler direkt an das window-Objekt anzuhängen, anstatt an HTMLBodyElement.
Dieses Ereignis kann nicht abgebrochen werden und es wird nicht weitergeleitet.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder legen Sie eine Ereignis-Handler-Eigenschaft fest.
addEventListener("load", (event) => { })
onload = (event) => { }
Ereignistyp
Ein generisches Event.
Beispiele
Dieses Beispiel zeigt auf dem Bildschirm an, wann immer das <img>-Element seine Ressource erfolgreich lädt.
HTML
<img id="image" src="favicon144.png" alt="MDN logo" width="72" />
<div><button onclick="reload()">Reload</button></div>
JavaScript
const image = document.getElementById("image");
image.onload = () => {
document.body.appendChild(document.createElement("div")).textContent =
"loaded!";
};
function reload() {
image.src = "favicon144.png";
}
Ergebnis
Spezifikationen
| Specification |
|---|
| UI Events # event-type-load |
| HTML # handler-onload |
| HTML # event-load |