Several ways to handle loading time in jquery
The first type:
JQuery (document). Ready (function() {alert ("Hello");
}); // or $ (document). Ready (function() {alert ("Hello");});
The second type:
JQuery (function() {alert ("Hello");}); // or $ (function() {alert ("Hello");});
The third type:
(function() {alert ("Hello");}) (jQuery); (function() {alert ("Hello");}) ($); (function() { alert ("you Ha");}) ();
In the above three ways, the third way of executing priority is higher than the first and second types. The first and second kind of lateral.
The above three kinds can be used window.onload = function () {}, instead.
$ (function () {}) and Window.onload () {} differ?
1.window.onload () {}; The onload code will be executed only if all the contents of the page (including all associated files of the element) are loaded .
$ (function () {}); executes when the DOM element of the page is loaded, without waiting for the picture or other media to be downloaded;
Execute the following code to verify:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "UTF-8"><title>Difference validation</title><Scriptsrc= "Http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></Script><Scripttype= "Text/javascript">functionImg_load () {alert ($ ("img"). attr ("width"));// -}$(function() {alert ($ ("img"). attr ("width"));//undefined $("img"). attr ("width","250px");});</Script></Head><Bodyonload= "Img_load ()"><imgalt=""src= "Images/404.jpg" /></Body></HTML>
$ (function () {}) and Window.onload () {} difference Validation
2.$ (document). The Ready () method can register different event handlers multiple times, and window.onload can only save a reference to a function at a time, and multiple bound functions only overwrite the previous function.
What is the difference between Body.onload and Window.onload () {}?
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "UTF-8"><title>OnLoad test</title><Scripttype= "Text/javascript">functiontest1 () {alert ("I'm test1 .");//Show}functiontest2 () {alert ("I'm test2 .");//Show}</Script></Head><Bodyonload= "test1 (), Test2 ()"></Body></HTML>
onload loads multiple function tests
Load multiple functions with $ (window). Load ()
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "UTF-8"><title>Insert Title here</title><Scriptsrc= "Http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></Script><Scripttype= "Text/javascript">//the Window object can only hold the application of one functionwindow.onload=function() {alert ("I was loading a");}; Window.onload=function() {alert ("I was loading two");//Show};//use the following method to solve window loading multiple functions$ (window). Load (function() {alert ("Test 1");//Show}); $ (window). Load (function() {alert ("Test 2");//Show});</Script></Head><Body></Body></HTML>
window.load Loading multiple function tests
SOURCE Link:jQuery (document). Ready (function ($) {}); several representations
jquery jquery (document). Ready (function ($) {}), several representations and differences between load and ready