JavaScript

方式一：window.onload：

當一個文件完全下載到瀏覽器中時，才會觸發window.onload事件。這意味著頁面上的全部元素對js而言都是可以操作的，也就是說頁面上的所有元素載入完畢才會執行。這種情況對編寫功能性程式碼非常有利，因為無需考慮載入的次序。

window.onload=function(){
    var userName="xiaoming";
    alert(userName);
}

Jquery

方式二：$(document).ready{ }： 

會在DOM完全就緒並可以使用時呼叫。雖然這也意味著所有元素對指令碼而言都是可以訪問的，但是，並不意味著所有關聯的檔案都已經下載完畢。換句話說，當HMTL下載完成並解析為DOM樹之後，程式碼就會執行。

假設有一個表現相簿的頁面，這種頁面中可能會包含許多大型影象，我們可以通過jQuery隱藏、顯示或以其他方式操作這些影象。如果我們通過onload頁面設定介面，那麼使用者在能夠使用這個頁面之前，必須要等到每一幅影象都下載完成。更糟糕的是，如果行為稍微新增給哪些具有預設行為的元素(比如連結)，那麼使用者的互動可能會導致意想不到的結果。然而當我們試用$(document).ready(){ }進行設定時，這個介面就會更早地準備好可用的正確行為。 

使用$(document).ready(){ }一般來說都要優於試用onload事件處理程式，但必須要明確一點的是，因為支援檔案可能還沒有家在完成，所以類似影象的高度和寬度這樣的屬性此時不一定有效。

$(document).ready(function(){ 
    var userName="xiaoming";
    alert(userName);
});

 簡寫為:

$(function(){ 
    var userName="xiaoming"; 
    alert(userName); 
});

PS:

(function($) {})(jQuery)什麼意思？

(function(){ 
    alert("hello");
})(jQuery);

其實際上是執行()(para)匿名方法,只不過是傳遞了jQuery物件。

相當於 :

function aa($){
    alert("hello");
};
 
aa(jQuery);

是初始化jquery物件的慣用方法。

通俗點說就是在頁面DOM載入完成後（不包括圖片下載完成）執行你需要的程式碼,由於不包括圖片下載，所以比window.onload效率高。

不過這個東西,有的時候會使頁面跳動，很多Jquery外掛都是在載入完成後，才改變樣式的，頁面會有跳動或閃動的感覺。比如ui.tab這個外掛，頁面元素一多，全部顯示出來了。它才形成TAB,很暈的說。

而    (function(){})();    立即執行函式；相當於先申明一個函式，宣告完後直接呼叫；

如果引數如：    (function(str){alert(str)})("output"));

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

總結：

•   jQuery(function(){　});

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

•  (function(){　})(jQuery);

用於存放開發外掛的程式碼，執行其中程式碼時DOM不一定存在，所以直接自動執行DOM操作的程式碼請小心使用。