Una delle funzioni di traversing più utili di jQuery è sicuramente .eq() . Ci permette di accedere ad un elemento di una selezione in base alla sua posizione, cioè al suo indice (index). Se quindi avessimo una serie di elementi HTML del genere
<div class="italiana">Lamborghini</div> <div>Bugatti</div> <div class="italiana">Ferrari</div> <div>McLaren</div>
potremmo accedere ad uno di essi in base al suo index:
$('div.italiana').eq(1).css('color', 'red');
È importante ricordarsi che l’index parte da zero, in questo caso quindi, il nome che diventerà rosso è Ferrari.
Facciamolo senza jQuery
Per ottenere lo stesso risultato non c’è necessariamente bisogno di jQuery, possiamo sfruttare funzioni già incluse in Javascript (vanilla, cioè “liscio”) con una sintassi molto semplice:
document.querySelectorAll('div.italiana')[1].style.color = 'red';
In questo caso, dobbiamo tenere presente che document.querySelectorAll restituisce un array, quindi dovremo accedere ai suoi elementi con l’index, lo stesso utilizzato con jQuery nell’esempio (1 nel nostro caso)
