.removeClass()

Si un nom de classe est inclus en tant que paramètre, alors seule cette classe sera supprimée de l’ensemble des éléments correspondants. Si aucune classe n’est spécifiée dans le paramètre, toutes les classes seront supprimées.

Avant la version 1.12/2.2 de jQuery, la méthode .removeClass() manipulait la propriété className des éléments sélectionnés, et non l’attribut class. Une fois la propriété modifiée, c’est le navigateur qui a mis à jour l’attribut en conséquence. Cela signifie que lorsque l’attribut class a été mis à jour et que le nom de la dernière classe a été supprimé, le navigateur peut avoir défini la valeur de l’attribut sur une chaîne vide au lieu de supprimer complètement l’attribut. Une implication de ce comportement était que cette méthode ne fonctionnait que pour les documents avec une sémantique DOM HTML (par exemple, pas des documents XML purs).

Depuis jQuery 1.12/2.2, ce comportement est modifié pour améliorer la prise en charge des documents XML, y compris SVG. À partir de cette version, l’attribut class est utilisé à la place. Ainsi, .removeClass() peut être utilisé sur des documents XML ou SVG.

Plusieurs classes peuvent être supprimées à la fois, séparées par un espace, de l’ensemble des éléments correspondants, comme ceci :

1
$( "p" ).removeClass( "myClass yourClass" )

Cette méthode est souvent utilisée avec .addClass() pour passer les classes d’éléments de l’une à l’autre, comme ceci:

1
$( "p" ).removeClass( "myClass noClass" ).addClass( "yourClass" );

Ici, les classes myClass et noClass sont supprimées de tous les paragraphes, tandis que yourClass sont ajoutées.

Pour remplacer toutes les classes existantes par une autre classe, nous pouvons utiliser .attr( "class", "newClass" ) à la place.

À partir de jQuery 1.4, la méthode .removeClass() nous permet d’indiquer la classe à supprimer en passant une fonction.

1
2
3
$( "li" ).last().removeClass(function() {
return $( this ).prev().attr( "class" );
});

This example removes the class name of the penultimate <li> from the last <li>.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *