JQuery fiecare funcție este utilizată pentru a itera printr-un obiect jQuery. Acesta conține unul sau mai multe elemente DOM, și oferă toate funcțiile jQuery. În plus, jQuery oferă o funcție auxiliară cu același nume, care pot fi cauzate fără selecție prealabilă sau crearea elementelor DOM. Să învățăm mai multe despre acest lucru.
Sintaxa jQuery .each ()
În exemplul următor, vom alege o pagină web toate elementele div și care provin indexul și un identificator al fiecăreia dintre ele. Rezultatul este posibil: "div0: antet", "div1: corp", "Div2: subsol". Exemplul utilizează jQuery fiecare funcție (). în loc să sprijine:
Următorul exemplu demonstrează utilizarea funcției auxiliare. În acest caz, obiectul pentru care bucla este setat ca primul argument. Acest exemplu va arăta modul de sortare matrice prin bucla prin jQuery fiecare funcție:
În cele mai recente jQuery fiecare exemplu, vreau să prezint cicluri prin proprietățile unui obiect:
Totul se reduce la formarea corespunzătoare a apel invers. Contextul de apel invers este egal cu acest al doilea argument, care este valoarea curentă. Dar, din moment ce contextul va fi întotdeauna un obiect, valorile simple, ar trebui să fie „împachetat“. Prin urmare, nu poate fi specificată egalitate strictă între valoarea și contextul. Primul argument - indicele curent, care este numărul de jQuery fiecare matrice sau șir (pentru obiecte).
- Exemplul principal al folosirii functiei jQuery .each ()
Să vedem modul în care fiecare) funcție (este utilizat în conjuncție cu jQuery obiect. În primul exemplu, toate elementele sunt selectate pe o pagină, și le afișează atributul href:
În al doilea exemplu de utilizare jQuery fiecare obiect afișează toate href externe pe o pagină web (cu condiția ca protocolul HTTP este utilizat):
Să presupunem că pagina conține următoarele link-uri:
Al doilea cod va da:
Elementele obiectului DOM folosind jQuery în interiorul fiecărui (), este necesar să se din nou „folie“. Pentru că el jQuery - aceasta este de fapt un container pentru o serie de elemente DOM. Cu ajutorul jQuery fiecare funcție matrice este tratată la fel ca normală. Prin urmare, nu vom fi înfășurat elementele imediat după tratament.
- EXEMPLU array jQuery.each ()
Încă o dată, uita-te la modul în care se pot ocupa de matrice de obicei:
Ieșirea codului: 0: 1, 1: 2, 2: 3, 3: 4, 4: 5 și 5: 6.
Matricea conține indici numerici, așa că vom obține un număr, pornind de la 0 la N - 1. unde N - numărul de elemente din matrice.
Putem avea mai multe structuri de date complexe, cum ar fi matrici de tablouri, obiecte din obiecte, tablouri în obiecte, sau obiecte în matrice. Să vedem cum jQuery găsi fiecare poate fi utilizat în aceste scenarii:
Rezultatul codului: roșu = # F00, verde = # 0f0, albastru = # 00F.
Ne ocupăm de structura folosind un apel pentru fiecare imbricată (). Apelul extern tratează JSON variabilă matrice. obiecte de procesare a apelurilor interne. În acest exemplu, fiecare jQuery fiecare element are doar o singură cheie. Dar, prin utilizarea codului prezentat poate fi setat la orice număr de chei.
Acest exemplu arată cum să rezolve fiecare element cu clasa productDescription:
Împreună cu selectorul, vom folosi o funcție de ajutor fiecare metodă () în loc de fiecare ():
Rezultatul folosirii jQuery fiecare funcție este următoarea: 0: Red. 1: Orange. 2: Verde.
Nu avem nevoie să utilizați indexul și valoarea. Aceștia sunt parametri care ajuta la a determina care element DOM este în prezent în curs de procesare ciclu. În plus, în script-ul, puteți folosi o metodă mai convenabilă pentru fiecare ():
Ai nevoie să-și încheie elementul DOM în noua instanță jQuery. Noi folosim metoda de text () pentru a obține elementul de text.
- întârziere EXEMPLU via jQuery.each ()
In acest jQuery fiecare exemplu, atunci când utilizatorul apasă elementul cu 5demo identificator. pentru toate elementele din listă este portocalie. După o dependentă de indicele de întârziere (0, 200, 400 milisecunde) va elementului disimularea gradat:
concluzie
Se recomandă să utilizați jQuery fiecare funcție. ori de câte ori este posibil. Se rezolvă o mulțime de probleme! Dincolo de jQuery dezvolta o mai bună utilizare a funcției foreach () din orice matrice ECMAScript 5.
Amintiți-vă: .each $ () și $ (selector) .each () - acestea sunt două metode diferite, definite în diferite moduri.
Traducerea articolului „5 jQuery fiecare () Exemple de funcții» Echipa de design web de proiect prietenos de la A la Z.