Maison  >  Article  >  interface Web  >  jquery supprime une classe

jquery supprime une classe

王林
王林original
2023-05-14 11:16:074465parcourir

Dans le développement front-end, nous devons souvent manipuler les attributs de classe des éléments DOM pour obtenir divers effets interactifs. Dans jQuery, nous pouvons facilement manipuler l'attribut de classe des éléments. Mais parfois, nous devons supprimer une classe spécifique, que devons-nous faire à ce moment-là ? Cet article explique comment utiliser jQuery pour supprimer une classe.

1. Utilisez la méthode RemoveClass

jQuery fournit une méthode appelée RemoveClass pour supprimer la classe d'un élément. Le format est le suivant :

$(selector).removeClass(className)

Parmi eux, selector fait référence au sélecteur de l'élément à exploiter, et className est le nom de la classe à supprimer.

Par exemple, si on veut supprimer la classe nommée "active" d'un élément avec l'identifiant "test", on peut écrire comme ceci :

$("#test").removeClass("active");

Cette méthode supprimera la classe spécifiée de l'élément sélectionné de la liste des classes .

Notez que si vous souhaitez supprimer plusieurs classes, vous devez les séparer par des espaces, par exemple :

$("#test").removeClass("active hidden");

2 Utilisez la méthode attr

En plus d'utiliser la méthode removeClass, nous pouvons également utiliser la méthode attr pour. supprimer des cours.

$(selector).attr("class", "")

Cette méthode définira la valeur de l'attribut de classe de l'élément sélectionné sur une chaîne vide, ce qui équivaut à supprimer toutes les classes.

$("#test").attr("class", "");

3. Utilisez la méthode toggleClass

En plus de supprimer des classes, nous devons parfois également changer de classe. En prenant la méthode toggleClass comme exemple, elle peut ajouter ou supprimer la classe spécifiée. Si l'élément a déjà la classe spécifiée, la classe sera supprimée, sinon la classe sera ajoutée.

Nous pouvons transmettre deux paramètres à la méthode toggleClass, l'un est le nom de la classe à changer et l'autre est le paramètre switch facultatif. Lorsque le paramètre switch est vrai, la classe sera ajoutée ; lorsque le paramètre switch est faux, la classe sera supprimée.

Voici le format de la méthode toggleClss :

$(selector).toggleClass(className, switch)

Par exemple, nous avons un bouton, et sa classe peut être utilisée pour basculer l'état du bouton (comme passer à "actif" ou "désactivé"). s'écrire comme ceci :

$("#btn").click(function(){
  $(this).toggleClass("active disabled");
});

Lorsque nous cliquons sur un bouton, sa classe sera ajoutée ou supprimée en conséquence.

Résumé

En bref, il est très simple de supprimer une classe dans jQuery, il suffit d'utiliser la méthode removeClass ou attr. Si vous devez changer de classe, utilisez la méthode toggleClass. Ces méthodes sont couramment utilisées dans jQuery. Les maîtriser peut vous permettre d'obtenir deux fois le résultat avec la moitié de l'effort de développement front-end.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn