La librairie Javascript jQuery de John Resig est en train de se répandre à grande vitesse, mais malgré une documentation assez complète, certains points restent obscurs. Voici par exemple comment créer votre propre filtre de sélection.
Le besoin particulier qui m’a conduit à trouver la solution que je vais exposer ici est de sélectionner des éléments dont le contenu texte est exactement égal à une chaine de caractères donnée.
jQuery propose le filtre contains() qui permet d’identifier des éléments qui contiennent la chaine de caractères ‘text’, de l’une des manières suivantes :
$('element').contains('text')...
$('element:contains(text)')...Malheureusement, ce filtre ne permet pas d’identifier des éléments qui contiennent exactement la chaine 'text', donc il faut le faire soi-même.
La solution directe, sans étendre jQuery, est d’utiliser filter() :
$('element').filter(function() {
return $(this).text() == 'text' ;
}Si cela est réalisable une ou deux fois dans un code relativement peu volumineux, il devient vite pénible de recopier tout ce code pour une opération qu’on imaginerait plus simple.
Heureusement, il est possible d’étendre jQuery, soit par des plugins soit directement jQuery lui-même et ses éléments, dont ses filtres. Cette dernière possibilité n’est par contre pas bien — voire pas du tout((Espérons juste que cette absence de documentation n’implique pas une pérennité douteuse)) — documentée.
Voici ce que ça donne pour le besoin particulier exprimé précédemment :
jQuery.extend(jQuery.expr[':'], {
containsExactly : "$(a).text() == m[3]"
}) ;Une fois ceci fait, il est possible de filtrer les éléments de la manière suivante :
$('element:containsExactly(text)')...Simple, n’est-ce pas ?
Ce qu’il faut savoir pour écrire ses propres filtres est surtout la définition des variables disponibles. Vous avez sans doute vu ces étranges a et m[3] dans le code ci-dessus. La première impression pourrait être que cela ne permet de filtrer que les éléments de type lien — balise <a> — mais il n’en est rien, ce a n’est qu’un nom de variable.
Voici donc la fameuse liste des variables, grâce à ce mail de Danny Wachsstock sur la liste de discussion jQuery :
apour l’élément à filtrerm[3]pour ce qui est entre parenthèses dans le sélecteuripour l’index de l’élément à filtrerrpour le tableau complet d’éléments
Comme indiqué dans le mail cité précédemment, vous trouverez de nombreux exemples dans cette liste de sélecteurs aditionnels.
A vous de jouer !