Load Events happen when the browser has finished loading an element.
The two most important load events:
- DOMContentLoaded (when HTML is ready)
- load (waits for pages, images, CSS, etc.)
DOMContentLoaded
The DOMContentLoaded event fires when the browser has fully loaded the HTML and built the Document Object Model (DOM) tree, but has not necessarily finished loading external resources like images and stylesheets.
The DOMContentLoaded event is best for initializing the user interface, attaching event handlers, and performing actions that only require the DOM to be ready.
Example
<p id="demo"></p>
<script>
// Add Event Listener to document
document.addEventListener("DOMContentLoaded", function () {
document.getElementById("demo").innerHTML = "HTML is loaded!";
});
</script>
Window Load
The load event fires when the entire page has fully loaded, including all dependent resources such as images, stylesheets, and sub-frames.
The load event is best for actions that require all resources available, such as getting the dimensions of an image or checking the browser type.
Example
<p id="demo"></p>
<script>
// Add Event Listener to window
window.addEventListener("load", function () {
document.getElementById("demo").innerHTML = "Page is fully loaded!";
});
</script>
Other Load Events
The load event can also be used on other elements that fetch resources (not just pages):
| Col 1 | Col 2 |
|---|---|
| Tag | Description |
| Fires when an image has finished downloading. | |
Load Events – FAQsQuick answers about learning Load Events in JavaScript. This free note from CodingNow 2.0 explains Load Events in JavaScript — concept, syntax and worked code examples you can copy, run and revise before interviews. Yes. Every JavaScript topic on CodingNow 2.0, including Load Events, is 100% free with no signup required. With focused practice, most students grasp Load Events in 1–3 days from these notes; pairing it with CodingNow 2.0's mentor-led course takes you to job-ready depth faster. Use the code examples in this note, then ask doubts for free on the CodingNow 2.0 Community (/community) — expert instructors answer within 24 hours.  |