本文實例講述了jquery的文檔處理程序。分享給大家參考，具體如下：
jquery文件處理程序
所謂的文件處理程序，是指jquery中提供的$(document).ready事件，此事件會在dom載入後觸發，而window.onlaod和body.onload都是在頁面完全載入後觸發。
jquery文件處理程序介紹
在jquery中想實作在dom載入完畢後的處理邏輯，只需要使用$(document).ready()事件。此事件函數稱為"jquery文件處理程序"。
可以在頁面的任何位置，甚至是外部的js檔案中，寫如下列語句：
$(document).ready(function (){ alert("document.ready")});
則在頁面的dom載入完畢後，會立刻執行alert語句。如果頁面上有大的圖片、js檔案等外部資源需要加載，jquery的文檔處理程序會在其之前執行，而window.onload和boyd.onload是在所有的資源文件加載完畢後執行的。
ready()函數時jquery"事件函數"中提供的一個jquery物件函數，簽章位元ready(fn)。
fn是ready事件發生時執行的函數。
因為是jquery物件函數，意味著可以在任何jquery物件上呼叫：
$("body").ready(function (){ alert("body.ready")});
上面的語句等同於：
$(document).ready(function (){alert("body.ready")});
雖然ready()函數可以作用在任何jquery物件上，但是使用時一定要注意物件是否具有ready事件。
也可以使用"$(fn)"這種簡化的形式：
$(function (){….})
//等效于$(document).ready(function(){…});
同jquery所有的事件物件一樣，$(document).ready事件，會依照出現的先後順序執行。
例如，可以呼叫兩次$(document).ready事件：
$(document).ready(function (){alert("document.ready-1")});
$(document). ready(function (){alert("document.ready-2")});
則在dom載入完畢後，先輸出"document.ready-1"，然後輸出"document.ready-2"。如果使用傳統的：
window.onload=function(){…..};
上面的程式碼會將window.onload原有的事件處理掉，然後綁定新的事件。
jquery文件處理程序的優點
如果腳本需要在頁面載入時執行，那麼大部分的腳本都可以放在$(document).ready()事件中。
在舉例jquery文件處理程序的優點之前，先看一個常見的javascript程式錯誤：dom未載入完成即改變dom模型。
在傳統的javascript程式設計中。有時會在頁面的頭部或底部直接插入script模組並編寫程式碼，例如下面的範例：
<!doctype html public "-//w3c//dtdxhtml 1.0
transitional//en""http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jquerystorm – 常见错误编程方式举例</title>
<scriptlanguage="javascript"type="text/javascript"src="../include/jquery-1.7.1.js"></script>
</head>
<body>
<!-- 页面内容部分 –>
<div id="divmsg" style="border:solid 1px#000000;padding:20px;"></div>
<!-- 尾部模块 -->
<script language="javascript" type="text/javascript">
//这条语句在某些情况下会导致错误
document.getelementbyid("divmsg").innerhtml="<divstyle=\"border:solid 2px #ff0000\">动态添加的图层</div>";
</script>
</boyd>
</html>
此範例在所有的瀏覽器都運作良好，但是有隱患。因為在頁面載入時，就在divmsg容器中新增了一個新的div對象，也就是新增了一個dom對象，當網速變慢或頁面很大需要一定的載入時間，會出現"中止操作"的錯誤。
這個錯誤甚至曾經在google首頁、淘寶等知名網站上都出現過，因為此錯誤很難在測試時候發現。
所以做web開發是要記住一條真理：永遠不要再dom載入時修改dom結構。
如果需要在頁面載入時修改dom結構，原始的做法是透過window.onload和body.onload事件實現，例如針對上面的錯誤例子，可以修改為：
<script type="text/javascript">
Window.onload=function()
{
Document.getElementById("divMsg").innerHTML="<divstyle="\border:solid 2px #FF0000\">动态添加的图层</div>";
};
</script>
具體的實作方式還有很多，應用window.onload和body.onload是因為這兩個事件都是在dom載入完成並且所有頁面資源載入完成後才執行的，這是最簡單的做法。或根據"document.readystate"判斷dom的狀態，如果是"complete"則進行某些操作，jquery的文檔處理程序$(document).ready內部正是使用的此原理。
更多關於jquery相關內容有興趣的讀者可查看本站專題：《jquery常用操作技巧總結》、《 jquery常見事件用法與技巧總結》、《 jquery操作json資料技巧總結》、《jquery操作xml技巧總結》及《jquery擴充技巧總結》
希望本文所述對大家jquery程式設計有幫助。
