Nok en konseptvideo! Dette er "bare en av de tingene" du trenger å forstå i jQuery. Det er faktisk litt unikt for jQuery, fordi andre populære JavaScript-biblioteker tidligere ikke har gjort det på denne måten.
Vi har allerede dekket velgere ganske mye. For eksempel vet du allerede at $("p")
vil velge alle avsnitt på en side. Ikke bare den første eller noen tilfeldige, alle sammen. Du kan lett forestille deg at det kan være mange av disse på en side. Tenk deg nå hva som skjer når du gjør:
$("p").hide();
Alle blir skjult, ikke sant? Ikke sant. Ikke den første eller noen tilfeldige, alle sammen. Den implisitte iterasjonen . Bak kulissene løper jQuery automatisk gjennom hele settet med elementer den fant, og kjører metoden du har valgt på dem. Vi trenger ikke bokstavelig talt å skrive en løkke selv for å gjøre dette. Virker ganske åpenbart hvis du er introduksjon til JavaScript, er jQuery, men mange biblioteker tidligere har krevd at du sløyfes med samlinger av elementer selv.
Hvis du vil, kan du fortsatt skrive løkken selv. Det vil kanskje se slik ut ved å bruke jQuery looping-metoder:
$("p").each(function() ( $(this).hide(); ));
Det er omtrent det samme. Ikke nødvendigvis, men du kunne. Det er eksplisitt iterasjon .
Noen ganger må du gjøre eksplisitt iterasjon. I utgangspunktet, hvis vi trenger tilgang til verdien av this
og gjøre noe spesielt med det, trenger vi vår egen loopkonstruksjon å jobbe med.
Eksemplet i denne skjermsendingen var å telle tegnene i listeelementer og legge det til på slutten av strengen. Vi trenger eksplisitt iterasjon for det.
Se pennen 4b53b9f55662d0d26339e18277500eee av Chris Coyier (@chriscoyier) på CodePen
Vi brukte jQuerys hver () -metode her, som er perfekt for det vi trenger. En nyttig bit det gjør for oss er å gi oss en nullindekserteller hver iterasjon vi kan få tilgang til om nødvendig.
$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2