Разница между поиском и фильтром

Недавно я прыгнул в мир jQuery. Я видел методы find() и filter(), но не могу понять разницу между ними.

В чем же разница между двумя?

Ответ 1

filter уменьшает набор уже согласованных элементов, а find получает потомки согласованного элемента.

Ответ 2

Ища ответы на вопрос, я нашел хороший блог, объяснив то же самое. Вот ссылка

Также вы можете попробовать его 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>

Ответ 3

найти()

find() возвращает потомки выбранных элементов, которые соответствуют селектору.

Из doc:

Описание: Получить потомки каждого элемента в текущем наборе согласованных элементов, отфильтрованных селектором.

фильтр()

filter() фильтрует элементы на основе селектора или предоставленной функции.

Из doc:

Описание. Уменьшите набор согласованных элементов до тех, которые соответствуют селектору или проходят проверку функции.

Ответ 4

find() возвращает дочерние элементы соответствия для данного селектора, filter() просматривает согласованные элементы и возвращает те, которые также соответствуют данному селектору.

Ответ 5

Найти против фильтра

Допустим, у вас есть этот массив:

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"} ]