logo

Méthode jQuery each()

Le chaque() La méthode dans jQuery spécifie une fonction qui s'exécute pour chaque élément correspondant. C'est l'une des méthodes de parcours largement utilisées dans JQuery. En utilisant cette méthode, nous pouvons parcourir les éléments DOM de l'objet jQuery et exécuter une fonction pour chaque élément correspondant.

Le chaque() accepte un paramètre fonction (index, élément) qui est une fonction de rappel qui s'exécute pour chaque élément sélectionné. Cette fonction nécessite en outre éventuellement deux paramètres qui sont l'index et l'élément. Nous devons donc passer une fonction de rappel à la méthode each().

Nous pouvons également revenir FAUX de la fonction de rappel pour arrêter la boucle plus tôt.

trouver des numéros bloqués sur Android

Syntaxe

 $(selector).each(function(index, element)) 

Valeurs des paramètres

Les valeurs des paramètres utilisées dans chaque() méthode sont définies comme suit.

fonction (index, élément): C'est un paramètre obligatoire. Il s'agit d'une fonction de rappel qui s'exécute pour chaque élément sélectionné. Il a deux valeurs de paramètre définies comme suit.

    indice:Il s'agit d'une valeur entière qui spécifie la position d'index du sélecteur.élément:C'est l'élément actuel. Nous pouvons utiliser ce mot-clé pour faire référence à l'élément actuellement correspondant.

Voyons quelques illustrations pour comprendre le chaque() méthode clairement.

Exemple 1

Dans cet exemple, le chaque() La méthode sera déclenchée en cliquant sur le bouton. Nous appliquons cette méthode au que éléments. Ainsi, cette méthode va parcourir chaque que élément. La fonction est exécutée pour chaque sélectionné que et affiche le texte du correspondant que élément utilisant la boîte d’alerte.

Ici, nous n'utilisons pas les valeurs des paramètres de la fonction de rappel.

 jQuery each() method <h2> Welcome to the javaTpoint.com </h2> <ul> <li> First element </li> <li> Second element </li> <li> Third element </li> <li> Fourth element </li> </ul> <p> Click the following button to see the list of <b> li </b> elements. </p> Click me function fun(){ $(document).ready(function(){ $(&apos;li&apos;).each(function(){ alert($(this).text()) }); }); } 

Sortir

décodage base64 en js
Testez-le maintenant

Après l'exécution du code ci-dessus, le résultat sera -

Méthode jQuery each()

En cliquant sur le bouton, une alerte s'affichera comme suit.

Méthode jQuery each()

De même, quatre boîtes d'alerte seront affichées en raison de quatre que éléments.

tableau dans les méthodes Java

Exemple2

Dans cet exemple, nous utilisons les valeurs des paramètres de la fonction de rappel qui sont indice et élément .

Nous appliquons le chaque() méthode sur que éléments. Ainsi, la méthode parcourra les éléments li à partir de l'index 0 . Il s'exécutera sur chaque sélectionné que élément et changez la couleur d’arrière-plan de l’élément correspondant.

L'itération s'arrête une fois la fonction renvoyée FAUX . Ici, il y en a six que éléments, et la fonction s'arrête lorsqu'elle atteint l'élément avec identifiant = 'i4' . Bien qu'il s'agisse du quatrième élément, l'index commence à 0 , donc la position de l'élément est 3 .

 jQuery each() method body{ text-align: center; } ul{ list-style-type: none; float: left; } li { width: 40px; height: 40px; margin: 5px; padding: 5px; font-size: 20px; float: left; border: 2px solid blue; } button{ font-size: 20px; } <h2> Welcome to the javaTpoint.com </h2> <ul> <li> 1 </li> <li> 2 </li> <li> 3 </li> <li id="i4"> Stop </li> <li> 5 </li> <li> 6 </li> </ul> Click me function fun() { $(document).ready(function(){ $(&apos;li&apos;).each(function(index, element) { $(element).css(&apos;background&apos;, &apos;lightgreen&apos;); if ($(this).is(&apos;#i4&apos;)) { $(&apos;p&apos;).text(&apos;Index begins with 0. So, the function stopped at position: &apos; + index ).css(&apos;fontSize&apos;, &apos;20px&apos;); return false; } }); }); } 

Sortir

Testez-le maintenant

Après l'exécution du code ci-dessus et en cliquant sur le bouton donné, la sortie sera -

Méthode jQuery each()