Un altro video concettuale! Questa è "solo una di quelle cose" che devi capire in jQuery. In realtà è un po 'unico per jQuery, in quanto altre popolari librerie JavaScript in passato non l'hanno fatto in questo modo.
Abbiamo già trattato parecchio i selettori. Ad esempio, sai già che $("p")selezionerà tutti i paragrafi su una pagina. Non solo il primo o uno casuale, tutti. Puoi facilmente immaginare che potrebbero essercene molti su una pagina. Ora immagina cosa succede quando fai:
$("p").hide();Tutti loro vengono nascosti, giusto? Giusto. Non il primo o uno casuale, tutti quanti. Quell'iterazione implicita . Dietro le quinte, jQuery scorre automaticamente l'intero set di elementi che ha trovato ed esegue il metodo che hai scelto su di essi. Non abbiamo letteralmente bisogno di scrivere un ciclo noi stessi per farlo. Sembra abbastanza ovvio se la tua introduzione a JavaScript è jQuery, ma molte librerie in passato ti hanno richiesto di scorrere personalmente le raccolte di elementi.
Se lo desideri, puoi comunque scrivere il loop da solo. Forse sarebbe simile a questo, usando i metodi di loop jQuery:
$("p").each(function() ( $(this).hide(); ));È più o meno la stessa cosa. Non necessariamente, ma potresti. Questa è un'iterazione esplicita .
A volte è necessario eseguire un'iterazione esplicita. Fondamentalmente, se dobbiamo accedere al valore di thise fare qualcosa di speciale con esso, avremo bisogno del nostro costrutto di ciclo con cui lavorare.
L'esempio in questo screencast contava i caratteri negli elementi dell'elenco e li aggiungeva alla fine della stringa. Avremo bisogno di un'iterazione esplicita per questo.
Guarda la penna 4b53b9f55662d0d26339e18277500eee di Chris Coyier (@chriscoyier) su CodePen
Abbiamo usato il metodo each () di jQuery qui che è perfetto per ciò di cui abbiamo bisogno. Un aspetto utile che fa per noi è fornirci un contatore indicizzato zero a ogni iterazione a cui possiamo accedere se necessario.
$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2