Détermination de la présence d'une classe d'élément en JavaScript

Lors de l'inspection des attributs de classe d'un élément, il est souvent nécessaire de vérifier s'il contient une classe spécifique. Le code fourni utilise une instruction switch pour examiner la valeur de classe exacte d'un élément, mais cette approche ne parvient pas à détecter les correspondances partielles.

Pour résoudre cette limitation, envisagez d'utiliser la méthode element.classList .contains. Cette méthode accepte un nom de classe comme paramètre et renvoie un booléen indiquant sa présence dans la liste des classes de l'élément :

element.classList.contains(class);

Cette méthode est universellement prise en charge dans les systèmes modernes. navigateurs et fournit un moyen cohérent de vérifier l'inclusion de classes.

Alternativement, pour la compatibilité avec les navigateurs plus anciens dépourvus de la méthode .contains, vous pouvez utiliser la version modifiée suivante de la méthode indexOf :

function hasClass(element, className) {
    return (' '   element.className   ' ').indexOf(' '   className   ' ') > -1;
}

Cette modification garantit que vous détectez avec précision les correspondances partielles, évitant ainsi les faux positifs lorsque la classe que vous recherchez fait partie d'un nom de classe plus grand.

Application de cette méthode à l'exemple fourni :

var test = document.getElementById("test"),
    classes = ['class1', 'class2', 'class3', 'class4'];

test.innerHTML = "";

for(var i = 0, j = classes.length; i 
En utilisant la méthode .contains ou la fonction indexOf modifiée, vous pouvez déterminer de manière fiable si un élément contient une classe spécifique en JavaScript, quelle que soit la compatibilité du navigateur ou la présence de correspondances partielles.