JQuery - Difference between $(document).ready() and window.onload()





Execution Point:
$(document).ready() event occurs after the HTML document (DOM) has been loaded. window.onload() event occurs later, when all content (e.g. images, frames) also has been loaded.
DOM vs JQuery:
ready event is specific to jQuery. onload event is a standard event in the DOM.
Execute before onload() Execute after ready()
Requires JQuery:
Yes No

//Load JQuery first before execution
//Code goes here
//Code goes here

//Code goes here
We can have multiple usage on page Can be used only once on page

What is jQuery.noConflict?

jQuery.noConflict is used to avoid conflict of jQuery $ function or variable name used/referred by other JavaScript libraries  (e.g. Prototype, MooTools).

In case of conflict we can use jQuery.noconflict(). After execution of this we can reference JQuery  ($) using jQuery  or own specific keyword.


Example 1: Refer JQuery using jQuery


// Something with jQuery

jQuery( "div p" ).hide();

// Something with another library's $()

$( "content" ).style.display = "none";


Example 2: Refer JQuery using own keyword ($own)


Var $own = jQuery.noConflict();

// Something with jQuery

$own( "div p" ).hide();

// Something with another library's $()

$( "content" ).style.display = "none";