Un alt concept video! Acesta este „doar unul dintre acele lucruri” pe care trebuie să le înțelegeți în jQuery. Este de fapt un pic unic pentru jQuery, deoarece alte biblioteci JavaScript populare din trecut nu au făcut acest lucru.
Am acoperit deja selectoarele destul de puțin. De exemplu, știți deja că $("p")va selecta toate paragrafele de pe o pagină. Nu doar primul sau unele aleatorii, toate. Vă puteți imagina cu ușurință că pot fi multe dintre acestea pe o pagină. Acum imaginați-vă ce se întâmplă atunci când faceți:
$("p").hide();Toți se ascund nu? Dreapta. Nu prima sau unele întâmplătoare, toate. Această iterație implicită . În culise, jQuery parcurge automat întregul set de elemente pe care le-a găsit și rulează metoda aleasă de ele. Nu trebuie literalmente să scriem noi înșine o buclă pentru a face acest lucru. Pare destul de evident dacă introducerea în JavaScript este jQuery, dar multe biblioteci din trecut v-au cerut să repetați singuri colecțiile de elemente.
Dacă doriți, puteți scrie singur bucla. Poate că ar arăta așa, folosind metode de buclare jQuery:
$("p").each(function() ( $(this).hide(); ));Este cam același lucru. Nu neapărat, dar ai putea. Aceasta este o iterație explicită .
Uneori trebuie să faceți o iterație explicită. Practic, dacă trebuie să accesăm valoarea thisși să facem ceva special cu ea, vom avea nevoie de propria noastră construcție de buclă pentru a lucra.
Exemplul acestui screencast a fost numărarea caracterelor din elementele listei și adăugarea acestuia la sfârșitul șirului. Pentru asta vom avea nevoie de o iterație explicită.
Vedeți Penul 4b53b9f55662d0d26339e18277500eee de Chris Coyier (@chriscoyier) pe CodePen
Am folosit fiecare metodă jQuery aici, care este perfectă pentru ceea ce avem nevoie. Un bit util pe care îl face pentru noi este că ne oferă un contor zero indexat la fiecare iterație la care putem accesa dacă este necesar.
$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2