.ready()
.ready( handler ) 返回: jQuery
描述: 當(dāng)DOM完全加載完成時(shí),指定一個(gè)函數(shù)來執(zhí)行。
-
version added: 1.0.ready( handler )
handler當(dāng)DOM完全加載完成時(shí),執(zhí)行一個(gè)函數(shù)。
雖然JavaScript提供了load事件,當(dāng)頁面執(zhí)呈現(xiàn)時(shí)用來執(zhí)行這個(gè)事件,直到所有的東西,如圖像已被完全接收前,此事件不會被觸發(fā)。在大多數(shù)情況下,只要DOM結(jié)構(gòu)已完全加載腳本就可以運(yùn)行。傳遞給處理函數(shù)給.ready()能保證DOM準(zhǔn)備好后就執(zhí)行這個(gè)函數(shù),所以附加所有其他的事件處理程序和運(yùn)行其它jQuery代碼,這個(gè)方法通常是最好的地方。當(dāng)使用腳本依賴CSS樣式屬性值的時(shí)候,重要的是要引用外部樣式或引用樣式元素防止在腳本之前。
如遇到有代碼依賴于加載元素(例如,如果一個(gè)圖像的尺寸為必須項(xiàng)),代碼應(yīng)該被放置在該處理函數(shù)中,用來替換load 事件。
.ready()方法通常是不符合<body onload="">屬性。如果load必須使用,要么不使用.ready(),要么使用jQuery的.load()方法來附加load事件處理函數(shù)到window或更多的具體對象,比如圖片。
以下三個(gè)語法全部是等價(jià)的:
$(document).ready(handler)-
$().ready(handler)(this is not recommended) $(handler)
還有$(document).bind("ready", handler)。此行為類似于 ready 方法,但有一個(gè)例外:如果ready 事件已準(zhǔn)備觸發(fā),你再嘗試用.bind("ready")綁定處理函數(shù)將不會被執(zhí)行。
.ready()方法只能在一個(gè)jQuery對象匹配的當(dāng)前文檔上調(diào)用。所以選擇可以省略。
.ready()方法通常用于一個(gè)匿名函數(shù):
$(document).ready(function() {
// Handler for .ready() called.
});
如果.ready()在DOM被初始化后被調(diào)用,新的處理函數(shù)通過將立即執(zhí)行。
Aliasing the jQuery Namespace
當(dāng)使用其他JavaScript庫時(shí),我們不妨調(diào)用$.noConflict()以避免命名空間中的混淆。當(dāng)這個(gè)函數(shù)被調(diào)用,$快捷方式將不再可用,迫使我們每次將寫$的時(shí)候?qū)?code>jQuery代替 。然而,處理函數(shù)傳遞給.ready()方法可以帶一個(gè)參數(shù),這個(gè)參數(shù)就是全局的jQuery對象。這意味著我們可以重新命名上下文對象內(nèi)的.ready()處理函數(shù),而不影響其他代碼:
jQuery(document).ready(function($) {
// Code using $ as usual goes here.
});
Example:
顯示當(dāng)DOM加載的信息。
<!DOCTYPE html>
<html>
<head>
<style>p { color:red; }</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function () {
$("p").text("The DOM is now loaded and can be manipulated.");
});
</script>
</head>
<body>
<p>Not loaded yet.</p>
</body>
</html>