jQUery中的$(document).ready()方法和window.onload()方法的區別

 1.常規的Javascript代碼中,一般使用window.onload方法

window.onload = function(){//代碼}

 

2.jquery中,則使用$(document).ready()方法

$(document).ready(function(){//代碼})

3.兩個方法有類似的功能,可是在執行時機方面是有區別的
- window.onload方法是在網頁中全部的元素(包括元素的全部的關聯文件)徹底加載到瀏覽器後才執行,此時,javascript才能夠訪問網頁中的任何元素.
- 經過$(document).ready()方法註冊的事件處理程序,在DOM徹底就緒時就能夠被調用.此時,網頁中的全部元素對jQuery而言,都是能夠訪問的,但這並不表明這些元素關聯的文件都已經加載完畢.這也會形成一個問題,例如與圖片有關的html下載完,而且已經解析爲DOM樹了,但頗有可能圖片還未加載 完成,以至像圖片的寬度和高度這樣的屬性此時不必定有效.要解決該問題,能夠使用jquery中方的load()方法.該方法會在元素的onload事件中綁定一個處理函數.

$(window).load(function(){//代碼});

該方法就等價於 window.onload = function(){//代碼} 

4.編寫個數
- javascript中的onload事件一次只能保存對一個函數的引用,它會自動用後面的函數覆蓋前面的函數,不能在現有的行爲上添加新的行爲.

function one(){alert("one")};
function two(){alert("two")};

window.onload = one;
window.onload = two;

運行上述代碼,發現只能彈出字符串"two"對話框.

- $(document).ready()方法,每次調用,都會在現有的行爲上追加新的行爲,這些行爲會根據註冊的順序依次執行.

5.$(document).ready()方法有兩種簡寫形式.$(function(){}),另外$(document)也能夠簡寫爲$(),$().ready(function(){}).