Si tout va bien, cette version sera la dernière de la branche 1.1 avant de passer à la 1.2. Mis à part la correction des inévitables bugs, les principaux changements sont – outre la rapiditié accrue pour la traversée du DOM, la sélection des éléments et des ID – l’introduction de nouvelles fonctions. Voici un petit topo des nouveautés à l’usage de l’intégrateur web (des nouveautés sont aussi prévues pour faciliter la vie des développeurs) d’après l’annonce de John Resig sur le blog jQuery.
.slice() Vous en prendrez bien une tranche ?
Si vous connaissez la méthode slice() en javascript pour traiter les Arrays, vous avez de la chance car son fonctionnement est similaire dans jQuery. C’est une méthode efficace pour débiter les objets en tranches et atteindre les éléments par la position qu’ils occupent les uns par rapport aux autres. Voici quelques manières d’utiliser cette méthode slice() :
- $(« div »).slice(0,1); // Première div
- $(« div »).slice(-1); // Dernière div
- $(« div »).slice(1,-1); // Toutes les divs sauf la première et la dernière
- $(« div »).slice(1,3); // La deuxième et la troisième div
- $(« div »).slice(7,8); // La huitième div
Comme on peut le constater, cette nouvelle approche est très puissante. Mention spéciale pour la possibilité de sélectionner toutes les div d’une page à l’exception de la première et de la dernière. Pratique pour les styler de manière anonyme. (enlever les margin, par exemple).
Cette nouvelle fonction sert également pour le parcours du DOM en remplacant certaines syntaxes dépréciées :
- $(”div”).eq(0) devient $(« div »).slice(0,1);
- $(”div”).lt(2) devient $(« div »).slice(0,2);
- $(”div”).gt(2) devient $(« div »).slice(3);
:has()
Ce nouveau sélecteur remplace la méthode courante (div[p]) pour savoir si un élément se trouve dans un autre :
- $(« div:has(p) ») // Toutes les divs contenant un paragraphe
- $(« a:has(img) ») // Tous les liens contenant une image
- $(« div:has(a:has(img)) ») // Toutes les divs contenant un lien avec une image à l’intérieur
Sélecteurs XPath dépréciés ?
Il semble que la nouvelle mouture des sélecteurs XPath qui feront leur apparition dans la version 1.2 de jQuery diffère de la syntaxe utilisée jusqu’à présent. Quoiqu’il en soit, la compatibilité sera assurée avec les scripts et plugins existants.
Pour ma part, je n’utilise pas la syntaxe XPath et d’ailleurs je n’en ai pas vu l’intérêt pour le moment. Ceci dit voici ce que John Resig vous recommande :
- Sélecteur descendant
- Utiliser la syntaxe CSS $(”div p”) à la place du sélecteur XPath $(”div//p”) ou attendre le nouveau plugin XPath de la version 1.2.
- Sélecteur élément enfant
- Utiliser la syntaxe CSS $(”div > p”) à la place du sélecteur XPath $(”div/p”) ou attendre le nouveau plugin XPath de la version 1.2.
- Sélecteur élément parent
- Utiliser la syntaxe CSS $(”p”).parent(”div”) à la place du sélecteur XPath $(”p/../div”) ou attendre le nouveau plugin XPath de la version 1.2.
- Vérifier la présence d’un élément
- Utiliser la syntaxe CSS $(”div:has(p)”) à la place du sélecteur XPath $(”div[p]”) ou attendre le nouveau plugin XPath de la version 1.2.
- Sélecteur d’attribut
- Notez que même si ce sélecteur est déprécié dans cette version (1.1.4), il sera toujours présent dans jQuery 1.2. Toutefois il est recommandé d’utiliser le sélecteur CSS $(”a[href]”) à la place de $(”a[@href]”) ou d’attendre le nouveau plugin XPath de la version 1.2.
Que nous réserve jQuery 1.2 ?
Le mieux est encore de vous rendre sur la feuille de route de la version 1.2 😉 Si jQuery vous intéresse, je vous recommande jQuery.info qui s’est proposé de mettre à la disposition du public francophone des traductions diverses concernant l’actualité de jQuery aussi bien que la mise en place d’articles et de tutoriels.