Per catena di selettori (selector chain) in jQuery si intende il modo con cui la selezione iniziale degli elementi viene estesa aggiungendovi ulteriori selezioni e metodi che verranno eseguiti in serie da jQuery. Questo articolo si occuperà di questo aspetto.
La catena di selettori ha questa struttura di base:
$(selettore/i).metodo1().metodo2().metodoN();
Si inizia sempre con il metodo/wrapper $() (o jQuery()) a cui viene passato un selettore o più selettori e si prosegue quindi con una serie di metodi.
Ad esempio, ad un elemento con ID test possiamo aggiungere una classe CSS e quindi cambiarne il colore del testo con un'unica espressione:
$('#test').addClass('test').
css('color', 'blue');
La catena di selettori, specie se molto lunga, non andrebbe mai scritta su una sola riga, ma sempre suddivisa su righe successive come nell'esempio precedente.
Inoltre, per migliorare la performance, è sempre bene mettere in cache il selettore iniziale utilizzando una variabile:
var $test = $('#test');
$test.addClass('test').
css('color', 'blue');