<div> 元素是 <ul> 的父元素,同時是其中所有內容的祖先。
<ul> 元素是 <li> 元素的父元素,同時是 <div> 的子元素
左邊的 <li> 元素是 <span> 的父元素,<ul> 的子元素,同時是 <div> 的後代。
<span> 元素是 <li> 的子元素,同時是 <ul> 和 <div> 的後代。
jQuery遍歷-祖先 向上遍歷DOM樹
parent()-返回被選元素的直接父元素
parents()-返回被選元素的所有祖先元素。
也可以指定參數eg: parents("ul")
$(document).ready(function(){
$("span").parents("ul");
});
//返回<span>元素的所有祖先,且它是<ul>元素
parentsUntil()-返回介於兩個給定元素之間的所有祖先元素。
jQuery遍歷後代
children()-返回被選元素的所有直接子元素
也可以使用參數來指定。
$(document).ready(function(){
$("div").children("p.1");
});
//返回class="1"且是<div>的直接子元素的所有<p>元素,
find()-返回被選元素的後代元素,一路向下直到最後一個後代
$(document).ready(function(){
$("div").find("span");
}); //返回<div>後代的所有<span>元素
$(document).ready(function(){
$("div").find("*");
});//返回<div>的所有後代
在DOM樹中水平遍歷
siblings()
next()
nextAll()
nextUntil()
prev()
prevAll()
prevUntil()
jQuery遍歷-過濾,縮小搜索的範圍
first()-返回被選元素的首個元素
filter()-返回滿足條件的元素
not()-返回不匹配條件的所有元素
last() -返回被選元素的最後一個元素
eq()-返回被選元素中帶有指定索引號的元素。
索引號從 0 開始,因此首個元素的索引號是 0 而不是 1
$(document).ready(function(){
$("p").eq(1);
}); //選取第二個<p>元素(索引號1)