Maison >interface Web >js tutoriel >Introduction à each() de jquery et exemples détaillés de sa méthode de traversée
La méthode
each() peut rendre la structure de la boucle DOM concise et moins sujette aux erreurs. La fonction each() encapsule une fonction de traversée très puissante et est très pratique à utiliser. Elle peut parcourir tableau unidimensionnel , tableau multidimensionnel , DOM, JSON, etc. 🎜> en
javaScriptL'utilisation de $each pendant le processus de développement peut réduire considérablement notre charge de travail. Voici quelques utilisations courantes de chacun
var arr1 = [ "aaa", "bbb", "ccc" ]; $.each(arr1, function(i,val){ alert(i); alert(val); });alert(i) produira 0. , 1, 2
alert(val) affichera aaa, bbb, ccc
var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']] $.each(arr, function(i, item){ alert(i); alert(item); });arr2 est un tableau bidimensionnel, et item équivaut à prendre chaque tableau de ce tableau bidimensionnel.
item[0] par rapport à la prise de la première valeur de chaque tableau unidimensionnel
alert(i) affichera 0, 1, 2, car ce tableau bidimensionnel contient 3 éléments du tableau
alert(item ) sera affiché sous la forme ['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']
var arr = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']] $.each(arr, function(i, item){ $.each(item,function(j,val){ alert(j); alert(val); }); });alert(j) affichera 0, 1, 2, 0, 1, 2, 0, 1, 2
chacun traite les données json, ceci chacun est encore plus puissant, il peut parcourir chaque attribut.
var obj = { one:1, two:2, three:3}; each(obj, function(key, val) { alert(key); alert(val); });Ici, alert(key) produira un deux trois Sortie un, 1, deux, 2, trois. , 3
Pourquoi la clé ici n'est-elle pas un nombre mais un attribut ? Parce que le format json est un ensemble d'attributs et de valeurs non ordonnés, comment peut-il y avoir des nombres ?
Et ce val est équivalent à obj[key]
ecah traite les éléments dom Ici, un élément de formulaire d'entrée est utilisé comme exemple.
Si vous avez un morceau de code comme celui-ci dans votre domaine
<input name="aaa" type="hidden" value="111" /> <input name="bbb" type="hidden" value="222" /> <input name="ccc" type="hidden" value="333" /> <input name="ddd" type="hidden" value="444"/>
$.each($("input:hidden"), function(i,val){ alert(val); alert(i); alert(val.name); alert(val.value); });
alert(i) affichera 0, 1, 2, 3
alert(val.name); affichera aaa, bbb, ccc, ddd, si vous l'utilisez. name affichera le même résultat
jquery jugera automatiquement en fonction des éléments entrants, et puis basé sur Le résultat du jugement est traité par la méthode apply ou call. Dans l'implémentation de fn, vous pouvez directement utiliser ce pointeur
ou aux sous-éléments de l'objet. 1. L'objet obj est un tableau
Chaque méthode appellera la fonction fn un par un sur les sous-éléments du tableau jusqu'au résultat renvoyé en appelant un certain sous-élément est faux.En d'autres termes, nous pouvons le traiter par la fonction fn fournie pour quitter chaque appel de méthode après avoir rempli certaines conditions. Lorsque la méthode each fournit le paramètre arg, le paramètre passé par l'appel de fonction fn est arg, sinon : l'index du sous-élément, le sous-élément lui-même
2.obj L'objet n'est pas un tableau
Cette méthode est la même. La plus grande différence entre 1 et 1 est que la méthode fn sera exécutée une par une quelle que soit la valeur de retour. En d'autres termes, toutes les propriétés de l'objet obj seront appelées par la méthode fn, même si la fonction fn renvoie false. Les paramètres transmis lors de l'appel sont similaires à 1.
Trois méthodes de parcours 1 Sélecteur + parcours
$('div').each(function (i. ){
i est la valeur de l'index
cela signifie parcourir chaque
objet dom2 , sélecteur + traversal
$('div').each(function (index,domEle){
index est la valeur de l'index
domEle signifie parcourir chaque objet dom
});
3. Une méthode de parcours plus adaptée
1) Obtenez d'abord un objet de collection
2) Parcourez chacun des objets de collection Un élément
var d=$("div");
$.each(d,function (index,domEle){
d est la collection à parcourir
index est la valeur de l'index
domEle signifie parcourir chaque paire de dom
});
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!