Comment parcourir un tableau en jquery

jquery est une excellente bibliothèque Javascript qui fournit de nombreuses API pratiques pour gérer diverses opérations DOM et données. Lorsque nous devons parcourir un tableau, jquery fournit également diverses méthodes pour y parvenir.

1. $.each() méthode

$.each() est une méthode en jquery pour parcourir un tableau. Elle peut parcourir des collections. de tout type, y compris les tableaux, les objets et les NodeLists. La syntaxe spécifique est la suivante :

$.each(arr, function(index, value) {
  // 遍历操作
});

Cette méthode reçoit deux paramètres. Le premier paramètre arr est la collection qui doit être parcourue, et le deuxième paramètre function est le corps de la fonction exécutée lors du parcours, y compris le deux paramètres index et value, représentent respectivement l'index et la valeur de l'élément actuel.

Par exemple, nous voulons parcourir un tableau arr et imprimer la valeur et l'index de chaque élément du tableau :

var arr = ['a', 'b', 'c'];

$.each(arr, function(index, value) {
  console.log('index: ' + index + ', value: ' + value);
});

Le résultat de sortie est :

index: 0, value: a
index: 1, value: b
index: 2, value: c

#🎜 🎜#

Méthode $.map()

La méthode $.map() peut également être utilisée pour parcourir le tableau, mais contrairement à la méthode $.each(), il peut parcourir les résultats, les traiter et renvoyer un nouveau tableau. La syntaxe spécifique est la suivante :

$.map(arr, function(value, index) {
  // 处理操作
  return value;
});

Cette méthode reçoit deux paramètres. Le premier paramètre arr est le tableau qui doit être parcouru, et le deuxième paramètre function est le corps de la fonction exécutée lors du parcours, y compris le deux paramètres value et index, représentent respectivement la valeur et l'index de l'élément actuel.

Par exemple, nous voulons parcourir un tableau arr et convertir la valeur de chaque élément en lettres majuscules :

var arr = ['a', 'b', 'c'];

var newArr = $.map(arr, function(value, index) {
  return value.toUpperCase();
});

console.log(newArr); // ['A', 'B', 'C']

Notez que la méthode $.map() renvoie un nouveau tableau, l'arr du tableau d'origine ne sera pas modifié.

$.grep() méthode

$.grep() méthode peut filtrer les éléments qui remplissent les conditions dans le tableau et renvoyer un nouveau tableau. La syntaxe spécifique est la suivante :

$.grep(arr, function(value, index) {
  // 筛选条件
  return ...
});

Cette méthode reçoit deux paramètres. Le premier paramètre arr est le tableau qui doit être parcouru, et le deuxième paramètre fonction est la condition de filtrage, comprenant deux paramètres valeur et. index, qui représentent respectivement la valeur et l'index de l'élément actuel. Si vrai est renvoyé, cela signifie que l'élément remplit les conditions et est filtré.

Par exemple, nous voulons filtrer tous les nombres pairs dans un tableau :

var arr = [1, 2, 3, 4, 5];

var evens = $.grep(arr, function(value, index) {
  return value % 2 === 0;
});

console.log(evens); // [2, 4]

$.inArray() méthode
4. #🎜 🎜#$.inArray() peut trouver la position d'index d'un élément dans le tableau et renvoie -1 s'il n'existe pas. La syntaxe spécifique est la suivante :

$.inArray(value, arr);

Cette méthode reçoit deux paramètres. La première valeur du paramètre est l'élément qui doit être trouvé, et le deuxième paramètre arr est le tableau qui doit être parcouru.

Par exemple, nous voulons trouver la position d'index de l'élément 'c' dans un tableau arr :

var arr = ['a', 'b', 'c'];

var index = $.inArray('c', arr);

console.log(index); // 2

Il est à noter que la méthode $.inArray() renvoie un nombre représente la position d'index de l'élément dans le tableau. Si l'élément n'existe pas, renvoie -1.

Pour résumer, les méthodes pour parcourir les tableaux dans jquery incluent $.each(), $.map(), $.grep() et $.inArray(), etc. Nous pouvons choisir différentes selon nos besoins, méthodes pour mettre en œuvre différentes opérations.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!