本文實例講述了JQuery遍歷DOM節點的方法。分享給大家供大家參考。具體分析如下：
本節的核心是介紹JQuery的DOM操作，前面介紹了許多建立、刪除、替換等等節點操作。這裡介紹如何遍歷節點，選取臨近節點等的一些方法。
children()方法
此方法用於取得匹配元素的子元素集合。根據DOM樹的結構，可以知道各個元素之間的關係以及它們子節點的數量。
下面使用children()方法來取得匹配元素的所有子元素的個數。
var $body = $("body").children();
var $p = $("p").children();
var $ul = $("ul").children();
alert( $body.length ); // <body>元素下有2个子元素
alert( $p.length ); // <p>元素下有0个子元素
alert( $ul.length ); // <p>元素下有3个子元素
for(var i=0;i< $ul.length;i++){
alert( $ul[i].innerHTML );
}PS：children()方法只考慮子元素而不考慮任何後代元素。
next()方法
此方法用於取得匹配元素後面緊鄰的同儕元素。從DOM樹的結構可以知道p元素的下一個同儕節點是ul，因此可以透過next()方法來取得ul元素，程式碼如下：
var $p1 = $("p").next();
// 紧邻p元素后的同辈元素prev()方法
此方法用於取得匹配元素前面緊鄰的同儕元素。從DOM樹的結構可以知道ul元素的上一個同儕節點是p，因此可以透過prev()方法來取得p元素，程式碼如下：
var $ul = $("ul").prev();
// 紧邻ul元素前的同辈元素siblings()方法
此方法用來取得匹配元素前後所有的同儕元素。以DOM樹的結構為例。 ul元素和p元素互為同儕元素，ul元素下的3個li元素也互為同儕元素。
如果要取得p元素的同儕元素，則可以使用以下程式碼：
var $p2 = $("p").siblings();
// 紧邻p元素的唯一同辈元素closest()方法
它用來取得最近的匹配元素。首先檢查當前元素是否匹配，如果匹配則直接返回元素本身。如果不符合則向上尋找父元素，逐級向上直到找到符合選擇器的元素。如果什麼都沒找到則回傳一個空的JQuery物件。
例如，為點擊的目標元素的最近的li元素添加顏色，可以使用以下程式碼：
$(document).bind("click", function (e) {
$(e.target).closest("li").css("color","red");
})除此之外，在JQuery中還有很多遍歷節點的方法，例如find()、filter()、nextAll()、prevAIl()、parent()和parents()等，此處不再贅述，讀者可以查看附錄的JQuery速查表文件。值得注意的是，這些遍歷DOM方法有一個共同點，都可以使用JQuery表達式作為它們的參數來篩選元素。
希望本文所述對大家的jQuery程式設計有所幫助。
