J'ai récemment sauté dans le monde de jQuery. J'ai vu les méthodes find()
et filter()
mais ne peux pas comprendre la différence entre les deux.Différence entre find et le filtre
Quelle est exactement la différence entre les deux?
J'ai récemment sauté dans le monde de jQuery. J'ai vu les méthodes find()
et filter()
mais ne peux pas comprendre la différence entre les deux.Différence entre find et le filtre
Quelle est exactement la différence entre les deux?
find()
renvoie les enfants des éléments de match pour le sélecteur donné, filter()
examine les éléments appariés et renvoie ceux qui également correspondent le sélecteur donné.
find()
find()
renvoie les descendants des éléments sélectionnés qui correspondent à la sélection.
De l'doc:
Description: Obtenir les descendants de chaque élément dans l'ensemble courant d'éléments appariés, filtré par un sélecteur.
filtre()
filter()
filtre les éléments en fonction de la sélection ou de la fonction prévue.
De l'doc:
Description: Réduire l'ensemble d'éléments adaptés à ceux qui correspondent à la sélection ou passent le test de la fonction.
En cherchant des réponses à la question, j'ai trouvé un bon blog expliquant la même chose. Voici le link
vous essayez aussi sur 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>