jQuery-遍历

<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)