Recientemente salté al mundo de jQuery. Vi los métodos find() y filter() pero no puedo deducir la diferencia entre los dos.Diferencia entre búsqueda y filtro
¿Cuál es exactamente la diferencia entre los dos?
find() devuelve los hijos de los elementos coincidentes en el selector dado, filter() analiza los elementos coincidentes y devuelve los que también coinciden con el selector dado.
hallazgo()
find() devuelve los descendientes de los elementos seleccionados que coinciden con el selector.
Desde el doc:
Descripción: Obtener los descendientes de cada elemento en el conjunto actual de elementos emparejados, filtrada por un selector.
filtro()
filter() filtra los elementos basados en el selector o la función prevista.
Desde el doc:
Descripción: Reducir el conjunto de elementos emparejados a los que coinciden con el selector o pasan la prueba de la función.
Mientras buscaba respuestas a la pregunta encontré un buen blog, explicando lo mismo. Aquí es el link
también lo intente 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>