window.onload和$(document).ready(function(){})的區別

前段時間在面試以前查找並整理了一下window.onload和$(document).ready(function(){})區別，今天有時間更到個人博客上，因爲本人資歷尚淺，若有不對的地方，還請指正。

原文出自：http://www.php100.com/html/program/jquery/2013/0905/5954.html

 

一、執行時間上的區別：window.onload必須等到頁面內（包括圖片的）全部元素加載到瀏覽器中後才能執行。而$(document).ready(function(){})是DOM結構加載完畢後就會執行。

二、編寫個數不一樣：window.onload不能同時寫多個，若是有多個window.onload，則只有最後一個會執行，它會把前面的都覆蓋掉。$(document).ready(function(){})則不一樣，它能夠編寫多個，而且每個都會執行。

三、簡寫方法：window.onload沒有簡寫的方法，$(document).ready(function(){})能夠簡寫爲$(function(){})。

另外：因爲在$(document).ready()方法內註冊的事件，只要DOM就緒就會被執行，所以可能此時元素的關聯文件未下載完，例如與圖片有關的HTML下載完畢，而且已經解析爲DOM樹了，但頗有可能圖片還未加載完畢，因此例如圖片的高度和寬度這樣的屬性此時不必定有效。

要解決這個問題，可使用JQuery中另外一個關於頁面加載的方法---load（）方法。load（）方法會在元素的onload事件中綁定一個處理函數。若是處理函數綁定在元素上，則會在元素的內容加載完畢後觸發。如：$(window).load(function(){})=====window.onload = function(){}...