Ytterligare ett konceptvideo! Detta är "bara en av de sakerna" du behöver förstå i jQuery. Det är faktiskt lite unikt för jQuery, eftersom andra populära JavaScript-bibliotek tidigare inte har gjort det på detta sätt.
Vi har redan täckt väljare ganska mycket. Till exempel vet du redan att $("p")
kommer att välja alla stycken på en sida. Inte bara den första eller någon slumpmässig, alla. Du kan lätt föreställa dig att det kan finnas många av dessa på en sida. Föreställ dig nu vad som händer när du gör det:
$("p").hide();
Alla blir dolda, eller hur? Rätt. Inte den första eller någon slumpmässig, alla. Den implicita iterationen . Bakom kulisserna slingrar jQuery automatiskt igenom hela uppsättningen element som den hittade och kör den metod du valt på dem. Vi behöver inte bokstavligen själva skriva en slinga för att göra detta. Verkar ganska uppenbart om du introducerar till JavaScript är jQuery, men många bibliotek tidigare har krävt att du själv slingrar över samlingar av element.
Om du vill kan du fortfarande skriva slingan själv. Det skulle kanske se ut så här med jQuery looping-metoder:
$("p").each(function() ( $(this).hide(); ));
Det är ungefär samma sak. Inte nödvändigtvis, men du kan. Det är uttrycklig iteration .
Ibland måste du göra en uttrycklig iteration. I grund och botten, om vi behöver komma åt värdet av this
och göra något speciellt med det, behöver vi vår egen loopkonstruktion att arbeta med.
Exemplet i denna screencast räknade tecknen i listobjekt och bifogade det i slutet av strängen. Vi behöver uttrycklig iteration för det.
Se pennan 4b53b9f55662d0d26339e18277500eee av Chris Coyier (@chriscoyier) på CodePen
Vi använde jQuerys varje () -metod här, vilket är perfekt för det vi behöver. En användbar bit det gör för oss är att ge oss en nollindexerad räknare varje iteration vi kan komma åt om det behövs.
$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2