jQuery中filter()和find()的区别

Posted 2022-06-16 赶路人儿

1、filter方法是对匹配元素进行筛选，而find方法是对匹配元素的后代元素进行筛选。

eg:

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

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

alert( $find.html() ) ;

输出：测试2

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

输出：<p>测试2</p>

2、end() 方法：

主要是在利用 jQuery 的链条属性（命令链）时，jQuery 会比较有用。如果不使用命令链，我们一般是通过变量名来调用之前的对象，这样我们就不需要操作堆栈了。不过通过 end()，我们可以把所有方法调用串联在一起：

$(ul.first).find(.foo).css(background-color, red)
  .end().find(.bar).css(background-color, green);

这条命令链检索第一个列表中类名为 foo 的项目，并把它们的背景设置为红色。end() 会将对象还原为调用 find() 之前的状态，所以第二个 find() 查找的是 <ul class="first"> 内的 .bar ，而不是在列表的 <li class="foo"> 中查找，并将匹配元素的背景设置为绿色。最后的结果是第一个列表中的项目 1 和项目 3 被设置了带颜色的背景，而第二个列表中的项目没有任何变化。