logo

jQuery fiecare () metoda

The fiecare() metoda din jQuery specifică o funcție care rulează pentru fiecare element potrivit. Este una dintre metodele de traversare utilizate pe scară largă în JQuery. Folosind această metodă, putem itera elementele DOM ale obiectului jQuery și putem executa o funcție pentru fiecare element potrivit.

The fiecare() acceptă un parametru functie(index,element) care este o funcție de apel invers care se execută pentru fiecare element selectat. Această funcție necesită, în plus, opțional doi parametri care sunt index și element. Deci, trebuie să transmitem o funcție de apel invers metodei each().

Ne putem întoarce și noi fals din funcția de apel invers pentru a opri bucla mai devreme.

dimensiunea linguritei

Sintaxă

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

Valorile parametrilor

Valorile parametrilor utilizate în fiecare() metoda sunt definite după cum urmează.

functie(index,element): Este un parametru obligatoriu. Este o funcție de apel invers care se execută pentru fiecare element selectat. Are două valori ale parametrilor care sunt definite după cum urmează.

    index:Este o valoare întreagă care specifică poziția indexului selectorului.element:Este elementul actual. Putem folosi acest cuvânt cheie pentru a face referire la elementul cu potrivire curentă.

Să vedem câteva ilustrații pentru a înțelege fiecare() metoda clar.

Exemplul 1

În acest exemplu, fiecare() metoda va fi declanșată la apăsarea butonului. Aplicam aceasta metoda la acea elemente. Deci, această metodă va repeta peste fiecare acea element. Funcția este executată pentru fiecare selectat acea și afișează textul corespunzătoare acea element folosind caseta de alertă.

Aici, nu folosim valorile parametrilor funcției de apel invers.

 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()) }); }); } 

Ieșire

indexul java al
Testează-l acum

După executarea codului de mai sus, rezultatul va fi -

jQuery fiecare () metoda

Făcând clic pe butonul, va fi afișată o alertă după cum urmează.

jQuery fiecare () metoda

În mod similar, patru casete de alertă vor fi afișate din cauza a patru acea elemente.

c matrice de șiruri

Exemplul 2

În acest exemplu, folosim valorile parametrilor funcției de apel invers care sunt index și element .

Aplicam fiecare() metoda pe acea elemente. Deci, metoda va itera pe elementele li pornind de la index 0 . Se va executa pe fiecare selectat acea element și modificați culoarea de fundal a elementului corespunzător.

Iterația se oprește odată ce funcția revine fals . Aici, sunt șase acea elemente, iar funcția se oprește când ajunge la elementul cu id = 'i4' . Deși este al patrulea element, indexul începe la 0 , deci poziția elementului este 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; } }); }); } 

Ieșire

Testează-l acum

După executarea codului de mai sus și făcând clic pe butonul dat, rezultatul va fi -

jQuery fiecare () metoda