Comment vérifier l'existence d'une classe en JavaScript sans jQuery ?

Vérification de l'existence d'une classe avec du JavaScript simple

En JavaScript, vérifier si un élément contient une classe spécifique peut être réalisé sans s'appuyer sur les bibliothèques jQuery.

Une méthode consiste à utiliser la propriété className :

var test = document.getElementById("test");
var testClass = test.className;

if (testClass.includes("class1")) {
  test.innerHTML = "I have class1";
} else {
  test.innerHTML = "";
}

Cependant, cette approche a des limites si plusieurs classes sont présentes. Pour une solution complète, utilisez la méthode classList.contains :

element.classList.contains(class);

Cette méthode fonctionne sur les navigateurs modernes avec des polyfills appropriés pour les anciennes versions.

Alternativement, la méthode indexOf peut être utilisée, mais avec un ajustement :

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

Cela garantit que les correspondances partielles au sein d'autres noms de classe sont ignoré.

Pour appliquer cela à l'exemple fourni :

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

test.innerHTML = "";

for (var i = 0, j = classes.length; i < j; i++) {
  if (hasClass(test, classes[i])) {
    test.innerHTML = "I have " + classes[i];
    break;
  }
}

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!