1、周遊
2、向上周遊dom樹
3、向下周遊dom樹
4、在dom樹中水準周遊
5、過濾
1、周遊 我了解的周遊就是 根據一個結構中的一個點就可以找到整個結構的所有的東西。
2、向上周遊dom樹
- parent()
- parents()
- parentsUnit()
parent()隻會傳回被選擇元素的直接父元素
parents() 方法傳回被選擇元素所有祖先元素,它一路上直到文檔的跟元素
<html>
您也可以使用可選參數來過濾對祖先元素的搜尋。
$("span").parents("ul");
parentsUntil() 方法傳回介于兩個給定元素之間的所有祖先元素。
$("span").parentsUntil("div");
3、向下周遊dom樹
children()
find()
-
children() 方法傳回被選元素的所有直接子元素。
該方法隻會向下一級對 DOM 樹進行周遊。
$("div").children();
您也可以使用可選參數來過濾對子元素的搜尋。
下面的例子傳回類名為 “1” 的所有
<p>
元素,并且它們是
<div>
的直接子元素:
$("div").children("p.1");
- find()方法傳回被選元素的後代元素,一路向下直到最後一個後代。
下面的例子傳回屬于
<div>
後代的所有
<span>
元素:
$("div").find("span");
下面的例子傳回
<div>
的所有後代:
$("div").find("*");
4、在dom樹種水準周遊
有許多有用的方法讓我們在dom樹進行水準周遊
siblings()
next()
nextAll()
nextUntil()
prev()
prevAll()
prevUntil()
- siblings() 方法傳回被選元素的所有同胞元素。
$("h2").siblings();
$("h2").siblings("p");//可以有參數
-
next() 方法傳回被選元素的下一個同胞元素。
該方法隻傳回一個元素。
- nextAll()方法傳回被選元素的所有跟随的同胞元素。
- nextUntil() 方法傳回介于兩個給定參數之間的所有跟随的同胞元素。
- prev() 同級前一個
- prevAll() 同級前所有
- prevUntil() 同意到兩個 之間所有元素
5、過濾
縮小搜尋元素的範圍,三個最基本的過濾方法是:first(), last() 和 eq(),它們允許您基于其在一組元素中的位置來選擇一個特定的元素。其他過濾方法,比如 filter() 和 not() 允許您選取比對或不比對某項指定标準的元素。
- first() 方法傳回被選元素的首個元素。下面的例子選取首個
元素内部的第一個<div>
元素:<p>
$("div p").first();
- last() 方法傳回被選元素的最後一個元素。下面的例子選擇最後一個
元素中的最後一個<div>
元素:<p>
$("div p").last();
- eq() 方法傳回被選元素中帶有指定索引号的元素。索引号從 0 開始,是以首個元素的索引号是 0 而不是 1。下面的例子選取第二個
<p>
元素(索引号 1):
$(“p”).eq(1);
- filter() 方法允許您規定一個标準。不比對這個标準的元素會被從集合中删除,比對的元素會被傳回。下面的例子傳回帶有類名 “url” 的所有
元素:<p>
$("p").filter(".url");
- not() 方法傳回不比對标準的所有元素。提示:not() 方法與 filter() 相反。下面的例子傳回不帶有類名 “url” 的所有
元素:<p>
$("p").not(".url");