1
votes

Comment vérifier si TOUS les objets d'une classe spécifique partagent également une autre classe?

Je veux vérifier si tous les objets de classA partagent également classB . Cependant, avec le code suivant, il renvoie true si au moins un objet a la classB :

$(".classA").hasClass("classB")

Comment puis-je vérifier si tous les éléments avec classA ont également classB ? (avec jQuery ou Javascript brut)

javascript jquery

1 commentaires

$ ('. classA'). length == $ ('. classA.classB'). length …?

4 Réponses :

1
votes

Vous pouvez faire quelque chose comme:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="classA ClassB"></div>
<div class="classA ClassB"></div>
<div class="classA ClassB"></div>
<div class="classA"></div>
<div class="classA ClassB"></div>

Cela renverra les éléments qui n'ont pas ClassB

Si vous voulez obtenir tous les éléments qui ont les deux classes, supprimez simplement le ! de !$(this)

Démo p >

var c = $(".classA").filter(function() {
  return !$(this).hasClass("ClassB");
})

console.log(c)

var c = $(".classA").filter(function() {
  return !$(this).hasClass("ClassB");
})

0 commentaires

4
votes

J'utiliserais un tableau et utiliserais Array.prototype.every:

const everyAHasB = [...document.querySelectorAll('.classA')]
  .every(a => a.classList.contains('classB'));

Il n'est pas nécessaire de nécessiter une grande bibliothèque comme jQuery pour quelque chose d'aussi simple .

6 commentaires

Obtention d'une erreur: uncaught TypeError: Impossible de lire la propriété 'contient' de non défini

@AhsanKhurshid Vous devez utiliser un navigateur extrêmement ancien qui ne prend pas en charge classList . Voir stackoverflow.com/questions/5898656/... pour des méthodes alternatives

J'utilise le dernier navigateur Google Chrome: version 74.0.3729.169 (version officielle) (64 bits)

Vous pouvez vérifier ici en cliquant sur le lien: codepen.io/ahsanrathore/pen/KLZwNY?editors = 1010

Vous avez oublié de diffuser le querySelectorAll dans le tableau. Utilisez [... document , pas [document

Oh je suis désolé! ma faute :)

2
votes

Essayez ceci:

let hasClass = true;
$(".classA").each(function(){
  hasClass = hasClass && $(this).hasClass("classB")
})

0 commentaires

0
votes

Répétez simplement tous les éléments et vérifiez chacun d'eux:

let all=true;
$(".classA").each((el) => {
    if(!el.hasClass("classB")) all=false;
})

console.log(all)

1 commentaires

Je pense que el sera un élément DOM plutôt qu'un objet jQuery. Peut-être $ (el) .hasClass (...) .