Question

我最近跳进了jQuery的世界。我看到了方法find()和filter()，但无法弄清楚两者之间的区别。

这两者究竟有什么区别？

Answer 1

filter减少已匹配元素的集合，而find获取匹配元素的后代。

Answer 2

在寻找问题的答案时，我发现了一个不错的博客，并解释了同样的问题。这是link

您也可以在jsfiddle

上试用

<html>
<head>
    <style>div{ padding:8px; border:1px solid; }</style>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
       $(document).ready(function(){     
         $("#filterClick").click(function () {
               $('div').css('background','white');     
               $('div').filter('#Fruits').css('background','red');
         });     

         $("#findClick").click(function () {
              $('div').css('background','white');
              $('div').find('#Fruits').css('background','red');
         });     
     });        

    </script>
</head>
<body>
    <h1>jQuery find() vs filter() example</h1>
    <div id="Fruits">
        Fruits
        <div id="Apple">Apple</div>
        <div id="Banana">Banana</div>
    </div>     
    <div id="Category">
        Category
        <div id="Fruits">Fruits</div>
        <div id="Animals">Animals</div>
    </div>
    <br/><br/><br/>
    <input type='button' value='filter(Fruits)' id='filterClick'>
    <input type='button' value='find(Fruits)' id='findClick'>     
</body>

Answer 3

<强>找到（）

find()返回与选择器匹配的所选元素的后代。

来自doc：

描述：获取当前匹配元素集中每个元素的后代，由选择器过滤。

过滤器（）

filter()根据选择器或提供的函数过滤元素。

来自doc：

描述：将匹配元素集减少到与选择器匹配的元素集或通过函数测试。

Answer 4

find()返回给定选择器的匹配元素的子元素，filter()查看匹配的元素并返回也匹配给定选择器的元素。

Answer 5

filter() 方法用于过滤所有元素并返回匹配的元素，不匹配的元素被移除。

唯一的区别是 filter() 方法搜索所有元素，而 find() 方法仅搜索所有子元素。

Answer 6

查找与过滤器

假设您有以下数组：

array folks = [ 
  {name: "Bob", age: "32", occupation: "developer"}, 
  {name: "Bill", age: "17", occupation: "delinquent"}, 
  {name: "Brad", age: "40", occupation: "yes"} 
]

查找：

folks.find( fella => name === "Bob")
//Returns an object: {name: "Bob", age: "32", occupation: "developer"}

过滤器：

folks.filter( fella => name === "Bob")
//Returns an array: [ {name: "Bob", age: "32", occupation: "developer"} ]

Answer 7

.find（）将在第一个匹配项后查找并停止，而.filter（）将继续搜索整个数组

Answer 8

filter提供数组和找到的数据，但find仅给出数组中的数据而不是数组

Answer 9

查找和过滤的区别

filter() 方法搜索所有元素。
find() 方法仅搜索所有子元素。

查找和过滤器之间的区别

10 个答案: