首頁猿問 jQuery...

jQuery document.ready vs自調(diào)用匿名函數(shù)

JavaScript JQuery

牛魔王的故事 2019-08-26 14:06:13

jQuery document.ready vs自調(diào)用匿名函數(shù)這兩者有什么區(qū)別。$(document).ready(function(){ ... });(function(){ ... })();這兩個(gè)函數(shù)同時(shí)被調(diào)用嗎？我知道，當(dāng)瀏覽器呈現(xiàn)整個(gè)HTML頁面時(shí)會(huì)觸發(fā)document.ready，但第二個(gè)函數(shù)（自調(diào)用匿名函數(shù)）會(huì)怎樣。是否等待瀏覽器完成呈現(xiàn)頁面，或者只要遇到它就會(huì)調(diào)用它？

查看完整描述

3 回答

拉風(fēng)的咖菲貓

TA貢獻(xiàn)1995條經(jīng)驗(yàn) 獲得超2個(gè)贊

當(dāng)DOM（Document對(duì)象模型）準(zhǔn)備好執(zhí)行JavaScript代碼時(shí)，將執(zhí)行以下代碼。

$(document).ready(function(){

// Write code here

});

以上代碼的簡寫是：

$(function(){

// write code here

});

下面顯示的代碼是一個(gè)自我調(diào)用的匿名JavaScript函數(shù)，一旦瀏覽器解釋它就會(huì)執(zhí)行：

(function(){

//write code here

})(); // It is the parenthesis here that call the function.

下面顯示的jQuery自調(diào)用函數(shù)將全局jQuery對(duì)象作為參數(shù)傳遞給function($)。這使得$可以在自調(diào)用函數(shù)中本地使用，而無需遍歷定義的全局范圍。jQuery不是唯一可以使用的庫$，因此可以減少潛在的命名沖突。

(function($){

//some code

})(jQuery);

反對(duì) 回復(fù) 2019-08-26

FFIVE

TA貢獻(xiàn)1797條經(jīng)驗(yàn) 獲得超6個(gè)贊

$(document).ready(function(){ ... }); 或短 $(function(){...});
當(dāng)這個(gè)函數(shù)被調(diào)用時(shí)DOM is ready，你可以開始查詢元素。.ready()將在不同的瀏覽器上使用不同的方式來確保DOM真的準(zhǔn)備就緒。
(function(){ ... })();
這只不過是一個(gè)在瀏覽器解釋時(shí)盡快調(diào)用自身的函數(shù)ecma-/javascript。因此，你不太可能成功地在DOM elements這里采取行動(dòng)。

反對(duì) 回復(fù) 2019-08-26

白衣非少年

TA貢獻(xiàn)1155條經(jīng)驗(yàn) 獲得超0個(gè)贊

$(document).ready(function() { ... });簡單地將該函數(shù)綁定到ready文檔的事件，因此，正如您所說，當(dāng)文檔加載時(shí)，事件會(huì)觸發(fā)。
(function($) { ... })(jQuery);實(shí)際上是Javascript的構(gòu)造，并且所有代碼片段都將jQuery對(duì)象function($)作為參數(shù)傳遞并運(yùn)行函數(shù)，因此在該函數(shù)內(nèi)部$始終引用該jQuery對(duì)象。這有助于解決命名空間沖突等問題。

因此，＃1在文檔加載時(shí)執(zhí)行，而＃2立即運(yùn)行，jQuery對(duì)象名為$shorthand。

反對(duì) 回復(fù) 2019-08-26