Asv3's Blog

December 11, 2009

difference between window.onload and document.ready

Filed under: javascript — Tags: , , , , — asv3 @ 11:43 am

It’s pretty simple but people tend to forget.

Major bugbeer for javascript developers is non-availability of DOM for javascript execution, if you are including javascript inside <head> tag this is the common situation. window.onload solved this problem. if you callback a function on window.onload that function gets called after page loading completed. Here the problem is javascript execution needs to wait till all CSS and images gets loaded. Hence came the DOMContentLoaded. Most browsers trigger this event when they are ready for javascript execution, this event gets fire before window.onload

all javascript libraries provide hooks to this event,

in jquery

$(document).ready(function() {     
               // put all your jQuery goodness in here. 
            });

in yui 2.x

YAHOO.util.Event.onDOMReady(function() {
    domReady = true;
    alert('Dom is Ready');
});

1 Comment »

  1. Good explanation i found another one with examples –
    http://www.dotnetbull.com/2013/08/document-ready-vs-window-onload.html

    Comment by vivek07088 — September 17, 2013 @ 12:57 pm


RSS feed for comments on this post. TrackBack URI

Leave a comment

Blog at WordPress.com.