jQuery: le proprietà selector e context

Ogni espressione jQuery ha due importanti proprietà, selector e context. La prima restituisce una stringa contenente i selettori CSS usati nell'espressione, mentre la seconda restituisce il contesto in cui l'espressione ha luogo, partendo dall'oggetto globale del DOM HTMLDocument. Vediamone insieme i dettagli.

Partiamo da questa struttura:

<div id="test">
	<p>...</p>
	<p>...</p>
	<p>...</p>
</div>

Una semplice espressione jQuery è la seguente:

var $p = $('p', '#test');

che ha i seguenti valori nelle proprietà selector e context:

alert($p.selector); // #test p
alert($p.context);  // [object HTMLDocument]

La proprietà selector restituisce ciò che ci aspettavamo, ma context usa l'intero oggetto document. Per avere risultati più coerenti possiamo passare un'espressione DOM come secondo parametro dell'espressione jQuery:

var $p2 = $('#test p', document.body);
alert($p2.context); // [object HTMLBodyElement]

Come si può notare, ora il contesto è cambiato. Volendo essere ancora più specifici avremmo potuto usare l'espressione DOM document.getElementById('test'). Ricordate che le espressioni DOM sono notevolmente più performanti di quelle jQuery.