DOM - Document Loaded - onload event

1 - About

A document is in the loaded state once:

A document is in a ready state, all images are not finished downloading, including banner ads.

When the page is in this state the load event is emitted.

3 - Event

To ensure that the code runs after the browser finishes loading the document or an image, you may listen to the load event the following way.

3.1 - Element: onLoad attribute

  • An image

<img src="" alt="Lenna" width="150" onload="lennaHasLoaded(event)">

  • The script that we want to run after the image has loaded

function lennaHasLoaded(){
 console.log("Lenna has loaded");

3.2 - Document

3.2.1 - window.addEventListener

DOM - Event Listener function

window.addEventListener("load", function(event) {
    console.log("EventListener: All resources finished loading!");

3.2.2 - window.onload

window.onload = function() {
     console.log("window.onload: All resources finished loading!");

3.2.3 - Jquery

On load Demo:

<script src="[email protected]/dist/jquery.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

$(window).on("load", function() {
   console.log("The page has fully loaded");

Data Science
Data Analysis
Data Science
Linear Algebra Mathematics

Powered by ComboStrap