Original address: $ (document). Ready vs $ (window). Load vs Window.onload
$ (document). Ready
We Execute our code when DOM was ready except images.
1 //Call Type 12$ (document). Ready (function() {3 /** Work while all HTML loaded except images and DOM are ready **/4 //Your code5 });6 7 //Call Type 28$(function() {9 /** Work while all HTML loaded except images and DOM are ready **/Ten //Your code One }); A - //Call Type 3 -$ (document). On (' Ready ',function(){ the /** Work while all HTML loaded except images and DOM are ready **/ - //Your code - }); - + //Call Type 4 -JQuery (document). Ready (function(){ + /** Work while all HTML loaded except images and DOM are ready **/ A //Your code at});
$ (window). Load
It's work when all DOM is ready including images so it's useful when on document load we want to work with Imag Es.
1 $ (window). Load (function() {2/* * * This is come when complete Page is fully loaded, including all frames, objects and images **/3 });Window.onload
The onload event is a standard event in the DOM, while above-specific to JQuery. This is the $(window).load window.onload built-in JavaScript event also same functionality. The OnLoad event occurs when an object have been loaded.like if we take a example of image and call OnLoad event in image t AG then it would call when image would load. Generally we use it in body tag.
In HTML
1 <element onload= "MyFunction" ></element>
In JS
1 object.onload=function() {/**your Desire code**/}; // Here object can be window,body and etc1) Here alert ' call on body load ' call immediately after body have been loaded
1 // 2 <!--on the body onload call myFunction-->3 <body onload= "myFunction ()" >4 5 // in JavaScript 6 // MyFunction () which would call on body Load 7 function MyFunction () { 8 alert ("Call on body load" 9 } 2) here alert "Call on Image load "Call immediately after Image has been loaded
1 // In HTML 2 <!--on image onload call Myimagefunction ()-3 45// / /myFunction () which would call on image load6 function myimagefunction () {7 alert ("Call on image Load"); 8 }$ (document). Ready vs $ (window). Load vs Window.onload
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
