Open In App
Related Articles

Difference between window.onload and body.onload

Like Article
Save Article
Report issue

There is a slight difference between the windows onload and the body onload, but before approaching the differences between them first we required the knowledge of what are those onloads. After, that we will know the usage in different scenarios of those where we will notice the slight differences between them.

onloads: The onloads event is fired when an object is fully loaded, there are two types of onload event one is windows onload and body onload.

  1. Windows onload: This window’s onload event fires at the start.
  2. Body onload: This body onload event fires once all content is downloaded, if we want to find an element and update the style or content, then, body onload is the right choice to use.

Note: If update the style and content do not bother you then it does not matter which onload you are using.

The below example illustrates the differences between windows onload and body onload:


<!DOCTYPE html>
   <body onload="bodyLoad()">
      <div id="B1">
         <h1 style="color: green;">GeeksforGeeks</h1>
<p>A Computer Science Portal for Geeks</p>
        // Body onload
         function bodyLoad() {
             alert("Alert from body_onload");
             alert("content from d1: "
                   + document.getElementById("d1").innerText);
         // Window onload 
         function winLoad() {
             alert("Alert from window_onload");
             if (document.getElementById("B1") != null) {
                 alert("Content from body: "
                       + document.getElementById("B1").innerText);
             else {
                 alert("Failed to find B1");
         window.onload = winLoad();



  • Window onload:
  • Body onload:

Last Updated : 10 Feb, 2021
Like Article
Save Article
Share your thoughts in the comments
Similar Reads