Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

window.onload vs document.onload

Which is more widely supported: window.onload or document.onload?

like image 574
Chris Ballance Avatar asked Feb 25 '09 21:02

Chris Ballance


People also ask

What is the difference between window onload and document onload?

The general idea is that window. onload fires when the document's window is ready for presentation and document. onload fires when the DOM tree (built from the markup code within the document) is completed.

What is window onload?

The onload event occurs when an object has been loaded. onload is most often used within the <body> element to execute a script once a web page has completely loaded all content (including images, script files, CSS files, etc.).

What is window onload Why do we need window onload?

In simpler words, we can say that the window onload event is triggered whenever a web page is launched successfully. Onload event is used with to run a script once its substance (which includes CSS files, images, and scripts) of the page is triggered completely. However, you do not always need a tag.

What is the difference between load and onload?

load() event is that the code included inside onload function will run once the entire page(images, iframes, stylesheets,etc) are loaded whereas the $(document). ready() event fires before all images,iframes etc.


1 Answers

When do they fire?

window.onload

  • By default, it is fired when the entire page loads, including its content (images, CSS, scripts, etc.).

In some browsers it now takes over the role of document.onload and fires when the DOM is ready as well.

document.onload

  • It is called when the DOM is ready which can be prior to images and other external content is loaded.

How well are they supported?

window.onload appears to be the most widely supported. In fact, some of the most modern browsers have in a sense replaced document.onload with window.onload.

Browser support issues are most likely the reason why many people are starting to use libraries such as jQuery to handle the checking for the document being ready, like so:

$(document).ready(function() { /* code here */ }); $(function() { /* code here */ }); 

For the purpose of history. window.onload vs body.onload:

A similar question was asked on codingforums a while back regarding the usage of window.onload over body.onload. The result seemed to be that you should use window.onload because it is good to separate your structure from the action.

like image 148
Josh Mein Avatar answered Oct 21 '22 20:10

Josh Mein