jquery find()和filter()的区别

发表于

在Elleshop看到一效果，发现一个filter()方法，心想怎么不用我熟悉的find()呢，查了一个两个函数的区别，

文档上面是这么写的：

  • find(expr):搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法
  • filter(expr):筛选出与指定表达式匹配的元素集合。这个方法用于缩小匹配的范围。用逗号分隔多个表达式

自己写了一个demo测试一下，

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
    <head>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript">
            $(function(){
               alert($("p").find(".selected").html()); // find html
               alert($("p").filter(".selected").html()); // filter html
            });
        </script>
    </head>
    <body>
        <p>html</p>
        <p><span class="selected">find html</span></p>
        <p class="selected">filter html</p>
    </body>
</html>

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

总结：一个是对它的子集操作，一个是对自身集合元素筛选