18 Jquery 过滤查找方法

Posted 2021-01-02 工作在浏览器上人-YangBobin

一、筛选元素

• .eq()：减少匹配元素的集合为指定的索引的哪一个元素。
• .filter()：筛选元素集合中匹配表达式或传递函数的测试的那些元素集合。
• .first()：获取匹配元素集合中第一个元素。
• .has()：筛选匹配元素集合中的那些有相匹配的选择器或DOM元素的后代元素。
• .is()：针对一个选择器，DOM元素，或者jQuery对象检查当前匹配的元素集合，如果这些元素至少一个匹配给定的参数，那么返回true。
• .last()：获取匹配元素集合中最后一个元素。
• .map()：通过一个函数匹配当前集合中的每个元素,产生一个包含的返回值的jQuery新对象。
• .not()：删除匹配的元素集合中元素。
• .slice()：减少匹配元素集合由索引范围指定的一个子集。

二、树遍历

• .children()：获得元素集合中每个匹配元素的子元素，选择器选择性筛选。
• .contents()：获得每个匹配元素集合元素的子元素，包括文字和注释节点。
• .closest()：从元素本身开始，在DOM 树上逐级向上级元素匹配，并返回最先匹配的祖先元素。
• .find()：得到当前匹配的元素集合中每个元素的后代， 由一个选择器，jQuery对象，或元素过滤。
• .next()：取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。如果提供一个选择器，它检索下一个匹配选择器的兄弟元素。
• .nextAll()：获得每个匹配元素集合中所有下面的同辈元素，选择性筛选的选择器。
• .nextUntil()：通过选择器，DOM节点，或jQuery对象得到每个元素接下来的所有的兄弟元素，但不包括匹配的元素。
• .parent()：获得集合中每个匹配元素的父级元素，选择性筛选的选择器。
• .parents()：获得集合中每个匹配元素的祖先元素，选择性筛选的选择器
• .parentsUntil()：查找当前元素的所有的前辈元素，直到遇到选择器匹配的元素为止，不包括那个匹配到的元素。
• .prev()：取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。选择性筛选的选择器。
• .prevAll()：Get all preceding siblings of each element in the set of matched elements, optionally filtered by a selector.
• .prevUntil()：获得集合中每个匹配元素的所有前面的兄弟元素，选择性筛选的选择器。
• .offsetParent()：返回最近的被定过位的祖先元素。（译者注：祖先元素指该元素的上级元素，即包着它的外层元素）
• .siblings()：获得匹配元素集合中每个元素的兄弟元素，选择性筛选的选择器。

1、filter()和find()比较

find（）是对它的子集操作，filter（）是对自身集合元素筛选。

现在有一个页面，里面html代码为;

<div >
  <p class="rain">测试1</p>
</div>

<div class="rain">
  <p>测试2</p>
</div>

（1）如果我们使用find()方法：

var $find = $("div").find(".rain");
alert( $find.html() ) ;

将会输出：

另外find()其实还可以用选择器表示:

var $select = $("div .rain");

（2）如果使用filter()方法：

var $filter = $("div").filter(".rain");
alert( $filter.html() );

将会输出：

也许你已经看出它们的区别了。
find()会在div元素内 寻找 class为rain 的元素。而filter()则是筛选div的class为rain的元素。

三、连接

• .add()：添加元素到匹配的元素集合。
• .addBack()：上一组元素在堆栈中添加到当前设定， 任选由一个选择器过滤。
• .andSelf()：添加先前的堆栈元素集合到当前组合。
• .end()：终止在当前链的最新过滤操作，并返回匹配的元素集合为它以前的状态。
• .not()：删除匹配的元素集合中元素。