jQuery 3.6.2 est disponible et apporte de nouveaux sélecteurs dans Chrome

Mais a-t-on encore besoin de cette bibliothèque JavaScript en 2022 ?

jQuery 3.6.2 est disponible et apporte de nouveaux sélecteurs dans Chrome,
mais a-t-on encore besoin de cette bibliothèque JavaScript en 2022 ?

jQuery est une bibliothèque JavaScript libre et multiplateforme créée pour faciliter l'écriture de scripts côté client dans le code HTML des pages web. L'équipe responsable de son développement a annoncé la disponibilité de jQuery 3.6.2. Selon elle, l'impulsion principale de cette version a été l'introduction de nouveaux sélecteurs dans Chrome.

Vous l'avez certainement deviné, la version jQuery 4.0 annoncée depuis quelques années déjà va devoir encore attendre. Cette version sera une refonte de la bibliothèque JavaScript. En effet, l'API de base de jQuery consiste à sélectionner un élément, puis à faire quelque chose avec ce qui a été sélectionné. Sizzle, le moteur de sélection dans jQuery, gère la première partie. C’est un petit moteur rapide et efficace qui a ouvert la voie à des API de sélecteur natif telles que querySelectorAll ainsi qu’à des sélecteurs JavaScript et CSS natifs supplémentaires. Mais maintenant, beaucoup de ces sélecteurs sont intégrés dans les navigateurs modernes. L'équipe jQuery estime donc qu'il est presque temps de dire au revoir à Sizzle, ce qu'elle prévoit de faire dans la version 4.0. L'équipe jQuery assure y travailler, mais d'ici là, elle continuera à prendre en charge la branche 3.x et à résoudre des problèmes importants.

Quelles sont les nouveautés / améliorations apportées par jQuery 3.6.2

variables CSS indéfinies et avec des espaces uniquement

jQuery 3.6.1 a introduit une régression mineure où la tentative de récupération d'une valeur pour une propriété CSS personnalisée qui n'existait pas (c'est-à-dire $elem.css("--custom")) renvoyait une erreur au lieu de renvoyer undefined. Cela a été corrigé en 3.6.2. Dans la même lancée, l'équipe s'est également assuré que les valeurs d'espace uniquement renvoient la même chose sur tous les navigateurs. La spécification exige que les valeurs des variables CSS soient coupées, mais les navigateurs sont incohérents dans leur coupe. jQuery renvoie maintenant undefined pour les valeurs d'espaces uniquement afin de le rendre cohérent avec l'ancien jQuery et sur les différents navigateurs.

@@ -28,17 +28,37 @@ function curCSS( elem, name, computed ) {
// .css('filter') (IE 9 only, trac-12537)
// .css('--customProperty) (gh-3144)
if ( computed ) {

// Support: IE <=9 - 11+
// IE only supports `"float"` in `getPropertyValue`; in computed styles
// it's only available as `"cssFloat"`. We no longer modify properties
// sent to `.css()` apart from camelCasing, so we need to check both.
// Normally, this would create difference in behavior: if
// `getPropertyValue` returns an empty string, the value returned
// by `.css()` would be `undefined`. This is usually the case for
// disconnected elements. However, in IE even disconnected elements
// with no styles return `"none"` for `getPropertyValue( "float" )`
ret = computed.getPropertyValue( name ) || computed[ name ];

// trim whitespace for custom property (issue gh-4926)
if ( isCustomProp && ret !== undefined ) {
if ( isCustomProp && ret ) {

// rtrim treats U+000D CARRIAGE RETURN and U+000C FORM FEED
// Support: Firefox 105+, Chrome <=105+
// Spec requires trimming whitespace for custom properties (gh-4926).
// Firefox only trims leading whitespace. Chrome just collapses
// both leading & trailing whitespace to a single space.
//
// Fall back to `undefined` if empty string returned.
// This collapses a missing definition with property defined
// and set to an empty string but there's no standard API
// allowing us to differentiate them without a performance penalty
// and returning `undefined` aligns with older jQuery.
//
// rtrimCSS treats U+000D CARRIAGE RETURN and U+000C FORM FEED
// as whitespace while CSS does not, but this is not a problem
// because CSS preprocessing replaces them with U+000A LINE FEED
// (which *is* CSS whitespace)
// https://www.w3.org/TR/css-syntax-3/#input-preprocessing
ret = ret.replace( rtrimCSS, "$1" );
ret = ret.replace( rtrimCSS, "$1" ) || undefined;
}

if ( ret === "" && !isAttached( elem ) ) {


.contains() avec