Maison > Problème commun > Que signifie l'itération dans jquery

Que signifie l'itération dans jquery

尊渡假赌尊渡假赌尊渡假赌
Libérer: 2023-05-25 11:25:58
original
957 Les gens l'ont consulté

L'itération de JQuery représente le parcours, qui est divisé en itération explicite et itération implicite. La différence est : l'itération explicite, la méthode ".each()" est une itération explicite typique et la méthode jQuery ne peut exploiter que les éléments actuels un par un. un et en séquence. Éléments, itération implicite, la méthode jQuery peut effectuer une certaine opération sur tous les éléments de l'objet (qui remplissent les conditions) à la fois, quel que soit l'élément dont il s'agit actuellement, et le terminer en même temps.

Que signifie l'itération dans jquery

Le système d'exploitation de ce tutoriel : système Windows 10, jQuery version 3.6.0, ordinateur Dell G3.

L'itération de JQuery représente le parcours, qui est divisé en itération explicite et itération implicite :

L'itération explicite signifie qu'une certaine méthode jQuery ne peut opérer que sur l'élément actuel un par un et en séquence.

L'itération implicite signifie qu'une certaine méthode jQuery peut effectuer une certaine opération sur tous les éléments de l'objet (qui remplissent les conditions) à la fois, et que tous les éléments de l'objet peuvent être traités sans que personne ne s'en aperçoive. Vous ne savez pas sur quel élément est actuellement opéré, car vous pouvez tout faire en même temps.
Exemple d'itération de
style :

<ul>
<li>foo</li>
<li>bar</li>
</ul>
$( “li” ).addClass( “bar” );
Copier après la connexion

Il s'agit d'une itération implicite. Vous n'avez pas besoin de vous soucier de l'élément dont il s'agit actuellement, car la barre de classe est ajoutée à tous les éléments li en même temps.
Toujours avec cette fonction, si je veux l'écrire en utilisant une itération explicite, comment dois-je l'écrire ?

$( “li” ).each(function() {
$( this ).addClass( “foo” );
});
Copier après la connexion

Ajoutez des classes à li une par une Bien que la fonction puisse être réalisée en écrivant de cette façon, elle est évidemment plus verbeuse et n'est pas recommandée.
Laissez-moi vous donner un autre exemple qui ne peut être écrit qu'en utilisant une itération explicite : (Le code dans la partie HTML est le même que ci-dessus)

$( “li” ).each(function( index ) {
console.log( index + “: ” + $( this ).text() );
});
Copier après la connexion
Copier après la connexion

.each() est une itération explicite typique : d'abord, j'utilise le sélecteur pour tout sélectionner L'élément li forme un objet, donc l'objet ressemble à ceci (similaire au format json) : [ { 0: li }, { 1: li } ] Chaque objet a également son propre lot d'attributs...

.each() 方法。当遍历到第一个li元素的时候,就打印第一条信息;遍历到第二个 li 的时候,再打印第二条信息。

再回顾一下刚才那一段代码:

$( “li” ).each(function( index ) {
console.log( index + “: ” + $( this ).text() );
});
Copier après la connexion
Copier après la connexion

index是一个形参,表示当前轮到的那个元素的下标。既然是形参,不用 index,用 i 也行。
那么问题来了:为什么这个function里写一个参数,这个参数就代表下标了呢?答案是:.each() Revenez à la méthode .each(). Lorsque le premier élément li est parcouru, la première information est imprimée ; lorsque le deuxième élément li est parcouru, la deuxième information est imprimée.

Regardez le code tout à l'heure :

$(selector).each(function( index , element ){
//do something
})
Copier après la connexion

index est un paramètre formel, indiquant l'indice de l'élément qui est actuellement à son tour. Puisqu'il s'agit d'un paramètre formel, l'index n'est pas nécessaire, je peux être utilisé.
Alors la question se pose : pourquoi y a-t-il un paramètre écrit dans cette fonction qui représente l'indice ? La réponse est : la fonction de la méthode .each(), qui possède 2 paramètres. La méthode

.each s'écrit comme ceci : Le premier paramètre de la fonction

$( “li” ).each(function( i,element ) {
console.log($(element));
console.log( i + “: ” + $(element).text() );
});
Copier après la connexion
🎜 est l'indice de l'entier, et le deuxième paramètre est utilisé pour : renvoyer l'élément actuellement lu Par exemple, dans le code tout à l'heure, L'élément est Renvoie chaque li. Donc c'est toujours le même code qu'avant, on peut aussi l'écrire comme ceci : 🎜🎜rrreee🎜 Parfois on n'écrit pas element, juste parce que le mot clé this peut être utilisé à la place d'element. this est égal à element. De même, $(this) et $(element) sont identiques. Après avoir utilisé le sélecteur $() pour sélectionner cet élément ou des éléments d'élément, nous pouvons utiliser l'API fournie par jQuery pour les faire fonctionner très facilement. Par exemple, utilisez la méthode text() pour lire le contenu textuel de l'élément, ou utilisez le CSS. () pour modifier le style. Attendez 🎜🎜.

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal