document ready和onload的區別——JavaScript文件載入完成事件
頁面載入完成有兩種事件，一是ready，表示文件結構已經載入完成（不包含圖片等非文字媒體檔案），二是onload，指示頁面包含圖片等檔案在內的所有元素都載入完成。(可以說：ready 在onload 前載入！！！)
我的理解： 一般樣式控制的，比如圖片大小控制放在onload 裡面載入;
而：jS事件觸發的方法，可以在ready 裡面載入;
用jQ的人很多人都是這麼開始寫指令碼的： $(function(){ // do something });其實這個就是jq ready()的簡寫，他等價於： $(document).ready(function(){//do something})//或者下面這個方法，jQuer的預設引數是：“document”；$().ready(function(){//do something})
-----------------------------------------------------------------------------------------------------------------------------------------------
$(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法接觸JQuery一般最先學到的是何時啟動事件。在曾經很長一段時間裡,在頁面載入後引發的事件都被載入在”Body”的Onload事件裡.對於Body的Onload事件和JQuery的Ready方法相比，有很多弊端.比如:1.載入多個函式的問題<body onload="a();b();"></body>在Onload事件中只能這樣載入，很醜陋…而在JQuery中你可以利用多個JQuery.Ready()方法，它們會按次序依次執行
2.程式碼和內容不分離 這個貌似不用說了，讓人深惡痛絕-.-!!
3.執行先後順序不同 對於Body.Onload事件，是在載入完所有頁面內容才會觸發，我的意思是所有內容,包括圖片，flash等.如果頁面的這些內容很多會讓使用者等待很長時間. 而對於$(document).ready()方法，這個方法只是在頁面所有的DOM載入完畢後就會觸發,無疑很大的加快了網頁的速度. 但是對於一些特殊應用，比如圖片的放大縮小，圖片的剪裁。需要網頁所有的內容載入完畢後才執行的呢？我推薦使用$(window).load()方法，這個方法會等到頁面所有內容載入完畢後才會觸發，並且同時又沒有OnLoad事件的弊端. <script type="text/javascript"> $(window).load(function() { alert("hello"); }); $(window).load(function() { alert("hello again"); }); </script> 上面的程式碼會在頁面所有內容載入完成後按先後順序依次執行. 當然不要忘了與之對應的Unload方法$(window).unload(function() { alert("good bye"); });上面程式碼會在頁面關閉時引發.在所有DOM載入之前引發JS程式碼這個方法是我在除錯的時候最喜歡的，有時候開發的時候也用這種方法<body> <script type="text/javascript"> (function() { alert("hi"); })(jQuery) </script></body>對，就是利用js閉包的形式將js程式碼嵌入body，這段程式碼會自動執行，當然也可以直接嵌入js程式碼,這種方式要注意順序問題，如下：<body><div id="test">this is the content</div> <script type="text/javascript">
alert($("#test").html());//I Can display the content </script></body><body> <script type="text/javascript">
alert($("#test").html());//I Can't display the content </script> <div id="test">this is the content</div></body>上面兩段程式碼,第二段程式碼當中因為只能解釋到當前程式碼之前的DOM,而test並不存在於已經解析的DOM數.所以第二段程式碼無法正確顯示.