Parcourir jQuery - méthode filter()

Guide de遍历jQuery

Exemple

Changer la couleur de tous les div, puis ajouter une bordure à la classe "middle":

$("div").css("background", "#c8ebcc")
  .filter(".middle")
  .css("border-color", "red");

Essaye-le toi-même

Définition et utilisation

La méthode filter() réduit l'ensemble des éléments correspondants aux éléments correspondant à un sélecteur spécifié.

Syntaxe

.filter(sélecteur)
Paramètres Description
sélecteur Valeur de chaîne, contenant l'expression de sélecteur à utiliser pour correspondre à l'élément actuel de la collection.

Description détaillée

Si l'objet jQuery représente une collection d'éléments DOM, la méthode .filter() construit un nouvel objet jQuery à partir du sous-ensemble des éléments correspondants. Le sélecteur utilisé teste chaque élément ; tous les éléments correspondant à ce sélecteur sont inclus dans le résultat.

Réfléchis à cette page qui contient une liste simple :

<ul>
  <li>élément de liste 1</li>
  <li>élément de liste 2</li>
  <li>élément de liste 3</li>
  <li>élément de liste 4</li>
  <li>élément de liste 5</li>
  <li>élément de liste 6</li>
</ul>

Nous pouvons appliquer cette méthode à l'ensemble des éléments de cette liste :

$('li').filter(':even').css('background-color', 'red');

Essaye-le toi-même

Le résultat de cette appel est de设置为红色项目 1, 3, 5 的背景，这是因为它们都匹配选择器（回想一下，:even 和 :odd 使用基于 0 的索引）。

Utilisation de la fonction de filtrage

La deuxième forme de cette méthode consiste à filtrer les éléments par une fonction au lieu d'un sélecteur. Pour chaque élément, si la fonction retourne true, l'élément est inclus dans l'ensemble filtré ; sinon, il est exclu.

Regardez ce fragment HTML légèrement plus complexe ci-dessous :

<ul>
  <li><strong>list</strong> item 1 - une étiquette strong</li>
  <li><strong>list</strong> item <strong>2</strong>
   - deux <span>étiquettes strong</span></li>
  <li>élément de liste 3</li>
  <li>élément de liste 4</li>
  <li>élément de liste 5</li>
  <li>élément de liste 6</li>
</ul>

Nous pouvons sélectionner ces éléments de liste et les filtrer en fonction de leur contenu :

$('li').filter(function(index) {
  return $('strong', this).length == 1;
).css('background-color', 'red');

Guide de遍历jQuery