4-JQuery遍历

通过JQuery遍历，可以从当前元素开始，在家族树向上移动(祖先)，向下移动(子孙)，水平移动(同胞)。这种移动被称为对DOM进行遍历。

JQuery提供了多种遍历方法。遍历方法中最大种类是树遍历。

祖先

通过遍历DOM树，可以查找该元素的父元素，后者叫祖先。

有三个方法：

• parent()
• parents()
• parentsUntil()

parent()方法

该方法会返回被选元素的直接父元素。

该方法只会向上一级对DOM树进行遍历。

parents()方法

该方法返回被选元素的所有祖先元素，它会一路向上直到文档的根元素html。

也可以使用可选的参数来过滤对祖先元素的搜索。

例如：$("span").parents("ul");就选择了span元素的是ul元素的祖先

parantsUntil()方法

该方法返回介于两个给定元素之间的所有祖先元素。

例如：$("span").parentsUntil("div");返回了介于span和div元素之间，span的祖先元素，不包括div。

后代

两个用于遍历DOM树的JQuery方法：

• children()
• find()

children()方法

该方法会返回被选元素的所有直接子元素

该方法只会向下一级对DOM树进行遍历。

也可以使用可选参数来过滤对子元素的搜索，例如： $("div").children("p.1");

返回类名为1的所有p元素，并且是div的直接子元素。

find()方法

该方法返回被选元素的所有后代元素，一路向下直到最后一个后代。

有一个参数。

例如：想选择div后代中所有的span元素：$("div").find("span");

再例如：返回div所有的后代：$("div").find("*");

同胞

同胞有相同的父元素，有以下几个方法可以进行水平遍历：

• siblings()：返回被选元素的所有同胞元素，可以使用可选参数过滤
• next()：返回被选元素的下一个同胞元素
• nextAll()：返回被选元素后面的所有同胞元素
• nextUntil()：返回介于两个给定参数之间所有跟随的同胞元素，不包括给定元素

prev()、prevAll()、prevUntil()与上面用法相同，但是方向相反。

过滤

有几个过滤方法，他们允许鉴于在一组元素的位置来选择特定元素。

first()方法

first()方法返回被选元素的首个元素。

例子：选取首个div元素内部的第一个p元素

$("div p").first();

last方法

返回被选元素的最后一个元素。

例子：选取首个div元素内部的最后一个p元素

$("div p").last();

eq()方法

该方法返回必选元素带有指定索引号的元素，索引号从0开始。

例子：选取第二个p元素，索引号为1

$("p").eq(1);

filter()方法

该方法允许规定一个标准，不匹配这个标准的元素会被从集合中删除，匹配的元素会返回。

例子：返回类名为“url”的所有p元素

$("p").filter(".url");

not方法

该方法返回不匹配标准的所有元素，not方法和filter方法相反