jQuery 遍历，在DOM树中移动，用于根据其相对于其他元素的关系来 查找 或 选取 HTML元素，以某项选择开始，并沿着这个选择移动，直到你想要的元素上。
遍历祖先
遍历祖先，就是向上遍历DOM树，
- parent() - 返回被选元素的直接父元素，只会向上一级对DOM树进行遍历。
- parents() - 返回被选元素的所有祖先与那苏，一路向上直到文档的根节点<html>。
- parentsUntil() - 返回介于两个给定元素之间的所有祖先元素。
1 //parents方法可以传递想要指定的祖先元素ul。如果不传的话，则默认是所有的祖先元素。 2 $("span").parents("ul").css({"color":"red","border":"2px solid red"}); 3 4 //这是查找span -- div 之间的所有的祖先元素。如果祖先元素中含有多个div，则是向上查找遇到的第一个div之间的所有祖先元素。 5 $("span").parentsUntil("div").css({"color":"red","border":"2px solid red"});
遍历后代
遍历后代，是向下遍历DOM树，以查找元素的后代。
- children() - 返回被选元素的所有直接子元素，该方法只会向下一级对DOM树遍历。
- find() - 返回被选元素的所有后代元素，一路向下，直到最后一个后代。
1 //查找div元素的后代元素，也可以传进去参数进行过滤，使其查找后代元素中的 类名 为 test 的 p 标签 2 $("div").children("p.text"); 3 4 //返回属于 <div> 后代的所有 <span> 元素。也可以传递一个通配符 * 5 $("div").find("span");
遍历兄弟
在DOM树中遍历具有相同父元素的兄弟节点。
- siblings() - 返回被选元素的所有兄弟元素。
- next() - 返回被选元素的下一个兄弟元素。
- nextAll() - 返回被选元素的之后的所有兄弟元素。
- nextUntil() - 返回介于给定两个参数之间的所有跟随的兄弟元素。
- prev() - 返回被选元素的上一个兄弟元素。
- prevAll() - 返回被选元素的之前的所有兄弟元素。
- prevUntil() - 返回介于给定两个参数之间的所有前面的兄弟元素。
1 //默认返回被选元素的所有兄弟元素，也可以传递一个参数来指定兄弟元素 2 $("h2").siblings(”div“); 3 4 //返回 <h2> 的下一个同胞元素 5 $("h2").next(); 6 7 //返回介于 <h2> 与 <h6> 元素之间的所有同胞元素 8 $("h2").nextUntil("h6");
过滤-缩小搜索元素的范围
几个最基本的过滤方法是：
- first() - 返回被选元素的 匹配的 首个元素
- last() - 返回被选元素的 匹配的 最后一个元素
- eq() - 返回被选元素中带有指定索引号的元素，索引是从0开始的。
- filter() - 规定一个标准。不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回。
- not() - 返回不匹配标准的所有元素
//返回带有类名test的所有p元素 $("p").filter(".test"); //返回不带有类名 "test" 的所有 <p> 元素： $("p").not(".test");