原博地址：http://blog.163.com/zhaoyanping_1125/blog/static/20132915320111129113723710/
* document.ready和onload的區別
document.ready和onload的區別——JavaScript文檔加載完成事件
頁面加載完成有兩種事件：
一是ready，表示文檔結構已經加載完成（不包含圖片等非文字媒體文件）；
二是onload，指示頁面包含圖片等文件在內的所有元素都加載完成。
1、Dom Ready
用jQ的人很多人都是這么開始寫腳本的：
$(function(){
// do something
});
例如：
$(function() {
$("a").click(function() {
alert("Hello world!");
});
})
這個例子就是給所有的a標簽都綁定了一個click事件。即當所有鏈接被鼠標單擊的時候，都執行 alert("Hello World!");
(自己的理解)也就是說頁面加載時綁定，真正該觸發時觸發。
其實這個就是jq ready()的簡寫，他等價於：
$(document).ready(function(){
//do something
})
或者下面這個方法，jQuer的默認參數是：“document”；
$().ready(function(){
//do something
})
這個就是jq ready()的方法就是Dom Ready，他的作用或者意義就是:在DOM加載完成后就可以可以對DOM進行操作。
一般情況一個頁面響應加載的順序是，域名解析-加載html-加載js和css-加載圖片等其他信息。
那么Dom Ready應該在“加載js和css”和“加載圖片等其他信息”之間，就可以操作Dom了。
2、Dom Load
用原生的js的時候我們通常用onload時間來做一些事情，比如：
window.onload=function(){
//do something
}
或者經常用到的圖片，假設這個
document.getElementById("imgID").onload=function(){
//do something
}
這種就是Dom Load，他的作用或者意義就是:在document文檔加載完成后就可以可以對DOM進行操作，document文檔包括了加載圖片等其他信息。
那么Dom Load就是在頁面響應加載的順序中的“加載圖片等其他信息”之后，就可以操作Dom了。
3.用個最常用的例子說明Dom Ready和Dom Load兩者的區別
Dom Ready是在dom加載完成后就可以直接對dom進行操作，比如一張圖片只要<img>標簽完成，不用等這個圖片加載完成，就可以設置圖片的寬高的屬性或樣式等；
Dom Load是在整個document文檔（包括了加載圖片等其他信息）加載完成后就可以直接對dom進行操作，比如一張圖片要等這個圖標加載完成之后才能設置圖片的寬高的屬性或樣式等；
比 如一個圖片瀏覽的效果，通常如果圖片尺寸很大的情況下，為了防止圖片把頁面撐開通常會限定圖片的寬度或高度，如果是單張圖片或者是多張規格比例統一的圖片 下我們可以直接在<img>上加個寬度或者高度的屬性<img src=“img.jpg” alt=”碼頭的大照片” width=“100” height=“90”>，或者可以在css樣式中加寬度或者高度的屬性（推薦）。但是如果這些張規格比例不統一的圖片要瀏覽呢？那就有問題，你設 置寬高很可能造成圖片嚴重失真。在ie6之后ie7，ie8還有其他主流瀏覽器支持css2.1中min-width，max-width，min- height，max-width，這樣我們就可以用min-width，max-width，min-height，max-width解決這些問題， 但是ie6除非是拋棄性能問題用css表達式（當然old9(http://old9.blogsome.com/2008/10/26/css-expression-reloaded/)和懌飛(http://www.planabc.net/2009/09/21/optimization_of_css_eexpression/) 有關於css表達式性能問題的解決方案,大家可以看一下）。這個時候ie的最好解決方案就是用Dom Ready而不是Dom Load，因為通常大圖片加載的時候會一點一點的加載，這個在尺寸大，字節多，網速慢的時候表現的非常明顯，用Dom Load，通常是先把頁面撐開，加載完成后再把圖片重設寬高，圖片加載多少時間，這個頁面就會撐開多久，用戶會非常難受！！
這兩天寫到前台用到相關知識，以上內容為某Coder寫的，轉載過來用以記錄。