Sélection de plusieurs classes avec jQuery

222

J'ai bien regardé et je n'arrive pas à trouver comment sélectionner tous les éléments correspondant à certaines classes dans une instruction de sélecteur jQuery comme celle-ci:

$('.myClass', '.myOtherClass').removeClass('theclass');

Des idées sur la façon d'y parvenir? La seule autre option est de faire

$('.myClass').removeClass('theclass');
$('.myOtherClass').removeClass('theclass');

Mais je fais ça avec pas mal de classes, donc ça demande beaucoup de code.

javascript jquery jquery-selectors Kezzer
la source

Réponses:

402

Cela devrait fonctionner:

$('.myClass, .myOtherClass').removeClass('theclass');

Vous devez ajouter tous les sélecteurs multiples dans le premier argument à $ (), sinon vous donnez à jQuery un contexte dans lequel effectuer la recherche, ce qui n'est pas ce que vous voulez.

C'est la même chose que vous feriez en CSS.

Erik Bakker
la source
3
Que faire si je veux le faire correspondre uniquement lorsque chacun des éléments possède toutes les classes spécifiées?
IsmailS
12
Al right, j'ai eu celui-ci stackoverflow.com/q/1041344/148271 . en gros je vais devoir rejoindre tout le sélecteur d'intersection. Comme$(".myClass.myOtherClass")
IsmailS
En savoir plus sur le regroupement CSS: "Groupement" du W3C .
skrounge
@wal: Cette virgule est également nécessaire en CSS pour pointer vers les deux classes. Sans la virgule, il ferait référence à .myOtherClassquelque chose à l' intérieur .myClass.
geekuality
cette réponse ne répond pas à la question, de cette façon vous faites un OU !!!! pas ET !!
Mahmoud Khateeb
26

Avez-vous essayé cela?

$('.myClass, .myOtherClass').removeClass('theclass');
Ionuț G. Stan
la source
25

j'utilise $('.myClass.myOtherClass').removeClass('theclass');

Adman
la source
34
C'est le cas si un élément HTML a plusieurs classes et que vous souhaitez supprimer la classe de l'élément uniquement avec toutes ces classes. D'autres exemples suppriment la classe de tout élément avec l'une des classes séparées par des virgules. Votre exemple ne fonctionnerait que si mon élément HTML avait les deux , comme<div class="myClass myOtherClass theclass">
Kezzer
0 
// Due to this Code ): Syntax problem.    
$('.myClass', '.myOtherClass').removeClass('theclass');

Selon la documentation jQuery: https://api.jquery.com/multiple-selector/

Quand peut-on sélectionner plusieurs classes de cette manière:

jQuery(“selector1, selector2, selectorN”) // double Commas. // IS valid.
jQuery('selector1, selector2, selectorN') // single Commas. // Is valid.

en enfermant tous les sélecteurs dans une seule '...' ou double virgule, "..."

Donc, dans votre cas, la bonne façon d'appeler plusieurs classes est la suivante:

$('.myClass', '.myOtherClass').removeClass('theclass'); // your Code // Invalid.
$('.myClass , .myOtherClass').removeClass('theclass');  // Correct Code // Is valid.
Rehan Shah
la source