HTMLElement: load event - Web APIs | MDN
Syntax
Use the event name in methods like addEventListener(), or set an event handler property.
js
addEventListener("load", (event) => { })
onload = (event) => { }
Event type
A generic Event.
Examples
This example prints to the screen whenever the <img> element successfully loads its resource.
HTML
html
<img
id="image"
src="/shared-assets/images/examples/favicon144.png"
alt="MDN logo"
width="72" />
<div><button>Reload</button></div>
JavaScript
js
const image = document.getElementById("image");
image.onload = () => {
document.body.appendChild(document.createElement("div")).textContent =
"loaded!";
};
document.querySelector("button").addEventListener("click", reload);
function reload() {
image.src = "/shared-assets/images/examples/favicon144.png";
}
Result
Specifications
| Specification |
|---|
| UI Events # event-type-load |
| HTML # handler-onload |
| HTML # event-load |