document.ready和onload的區別——JavaScript文件載入完成事件

頁面載入完成有兩種事件

一是ready，表示文件結構已經載入完成（不包含圖片等非文字媒體檔案）

二是onload，指示頁面包含圖片等檔案在內的所有元素都載入完成。

用jQ的人很多人都是這麼開始寫指令碼的：

$(function(){

// do something

});

其實這個就是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了。

當然，如果兩種方式都有的話：

$(document).ready(function(){ $("#titleDiv").load("content.do?type=list"); })

$(function(){ $("#titleDiv").load("content.do?type=list"); });

那麼$(document).ready(function(){})

先被執行，而：$(function(){})後被執行。

$(function(){.....})();和和(function (){…} ());表示函式立即執行

1. $(function(){ }) 或 jQuery(function(){　})

   此函式也可以寫成 jQuery(function(){　})， 用於存放操作DOM物件的程式碼，執行其中程式碼時DOM物件已存在。不可用於存放開發外掛的程式碼，因為jQuery物件沒有得到傳遞，外部通過jQuery.method也調用不了其中的方法（函式）。

2. (function(){})() 或  function(){ })(jQuery)

   此函式也可以寫成   function(){ })(jQuery);其實際上是執行()(para)匿名方法,只不過是傳遞了jQuery物件。用於存放開發外掛的程式碼，執行其中程式碼時DOM不一定存在，所以若要直接自動執行DOM操作的程式碼請小心使用。它相當於：

function wido($){} ;  wisdo(jQuery), 是初始化jquery物件的慣用方法.

3. (function($){...})() 或 (function($){...})(jQuery)

  實際上是匿名函式,它等效於匿名函式 function(arg){...} ，引數為 arg，是初始化jquery物件的慣用方法，有的時候會使頁面跳動， 在呼叫函式時，是在函式後面寫上括號和實參的，由於操作符的優先順序，函式本身也需要用括號，即： (function(arg){...})(param)，這就相當於定義了一個引數為arg的匿名函式，並且將param作為引數來呼叫這個匿名函式，而(function($){...})(jQuery)則是一樣的，之所以只在形參使用$，是為了不與其他庫衝突，所以實參用jQuery，

例如：

(funtion(str){alert(str)})("output"))；相當於：funtion OutPutFun(str){alert(str);};OutPutFun("output");