簡介
$( document ).ready(function() {
console.log( "ready!" );
});在網頁文檔加載完畢前一個頁面是無法安全操縱的。jQuery可以爲我們檢測到待發狀態。
$(document).ready()中的代碼在 Document Object Model (DOM) 完畢後會立即執行。
$( window ).on( “load”, function() { … })中的代碼需要在全部頁面（圖片或框架等）完畢後纔會執行，而不僅僅是DOM。
簡寫：
$(function() {
console.log( “ready!” );
});
調用命名函數
function readyFn( jQuery ) {
// 文檔加載後執行的代碼
}
$( document ).ready( readyFn );
// 或：
$( window ).on( "load", readyFn );
測試
<html>
<head>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$( document ).ready(function() {
console.log( "document loaded" );
});
$( window ).on( "load", function() {
console.log( "window loaded" );
});
</script>
</head>
<body>
<iframe src="http://techcrunch.com"></iframe>
</body>
</html>運行後在控制檯可以看出，在頁面還是空白的時候已經”document loaded”了，等行內框架加載好後，才“window loaded”。
優點：
執行時機
使用 $(document).ready()，你能讓你的事件在window加載之前加載或觸發。所有你寫在這個方法裏面的都準備在最早的時刻加載或觸發。也就是說，一旦DOM在瀏覽器中註冊後，$(document).ready()裏的代碼就開始執行。這樣用戶在第一眼看見頁面元素時，特效就可以運行了。
多次執行
window.onload事件每次只能保存對一個函數的引用，他會覆蓋掉之前的函數，所以不能再現有行爲上添加新的行爲。如果引用了多個js文件，每個都需要window.onload方法就導致編碼複雜。
使用$(document).ready()方法能夠很好地解決這種問題，每次調用$document.ready()方法都會在現有行爲上追加新的行爲，這些行爲會根據註冊順序依次執行。
function say(str){
alert(str)
}
$(document).ready(function(){
say('hello')
})
$(document).ready(function(){
say('jQuery')
})
//依次彈出hello jQuery