JQUERY EACH() METODE

Det hver() metode i jQuery angiver en funktion, der kører for hvert matchede element. Det er en af de meget brugte traverseringsmetoder i JQuery. Ved hjælp af denne metode kan vi iterere over DOM-elementerne i jQuery-objektet og kan udføre en funktion for hvert matchede element.

Det hver() accepterer en parameter funktion (indeks, element) som er en tilbagekaldsfunktion, der udføres for hvert valgt element. Denne funktion kræver yderligere valgfrit to parametre, som er indeks og element. Så vi skal videregive en tilbagekaldsfunktion til each()-metoden.

Vi kan også vende tilbage falsk fra tilbagekaldsfunktionen for at stoppe løkken tidligt.

Syntaks

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

Parameterværdier

De parameterværdier, der bruges i hver() metode er defineret som følger.

funktion(indeks,element): Det er en obligatorisk parameter. Det er en tilbagekaldsfunktion, der udføres for hvert valgt element. Den har to parameterværdier, der er defineret som følger.

indeks:Det er en heltalsværdi, der angiver vælgerens indeksposition.element:Det er det nuværende element. Vi kan bruge dette søgeord til at henvise til det aktuelt matchede element.

Lad os se nogle illustrationer for at forstå hver() metode klart.

Eksempel 1

I dette eksempel er hver() metoden udløses ved at klikke på knappen. Vi anvender denne metode til at elementer. Så denne metode vil iterere over hver at element. Funktionen udføres for hver valgt at og viser teksten for den tilsvarende at element ved hjælp af advarselsboks.

Her bruger vi ikke parameterværdierne for tilbagekaldsfunktionen.

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

Produktion

Test det nu

Efter udførelse af ovenstående kode vil outputtet være -

Når du klikker på knappen, vil en advarsel blive vist som følger.

På samme måde vil fire advarselsbokse blive vist på grund af fire at elementer.

Eksempel 2

I dette eksempel bruger vi parameterværdierne for tilbagekaldsfunktionen, der er indeks og element .

Vi anvender hver() metode på at elementer. Så metoden vil iterere over li-elementerne startende fra indeks 0 . Det vil køre på hver valgt at element og ændre baggrundsfarven for det tilsvarende element.

Iterationen stopper, når funktionen vender tilbage falsk . Her er der seks at elementer, og funktionen stopper, når den når til elementet med id = 'i4' . Selvom det er det fjerde element, men indekset starter kl 0 , så elementets position er 3 .

java lang til int

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