In jQuery i selettori personalizzati (custom) iniziano tutti con il prefisso :
e si ottengono aggiungendo un metodo all'oggetto $.expr()
. Questo metodo ha tra i suoi parametri l'elemento jQuery da selezionare. Vediamone insieme i dettagli.
L'elemento jQuery non fa parte di un normale set jQuery ma è un elemento DOM. Occorre quindi utilizzare il wrapper $()
per poter utilizzare su di esso i metodi di jQuery.
Il metodo definito, che è una funzione, deve necessariamente restituire un valore booleano che indica se la selezione ha avuto successo o meno o, in altre parole, se l'elemento o gli elementi selezionati soddisfano la condizione richiesta.
Proviamo a definire un selettore che selezioni solo gli elementi flottati:
$.extend($.expr[':'], {
floats: function(element) {
return $(element).css('float') !== 'none';
}
});
Proviamo quindi a testare il nostro selettore:
$('#select').click(function() {
$(':floats', '#test').addClass('test');
});