Comment ajouter une classe à un élément HTML à l'aide de JavaScript ?

Ajout d'une classe à un élément en JavaScript

Introduction :
Amélioration des fonctionnalités d'un élément sur une page Web implique souvent de manipuler ses classes CSS. L'ajout d'une nouvelle classe peut fournir des styles ou des comportements supplémentaires à l'élément. Cette réponse explique comment ajouter une classe à un élément à l'aide de JavaScript, en tenant compte de la prise en charge des navigateurs modernes et des navigateurs existants.

Navigateurs modernes (Element.classList)
Pour les navigateurs modernes, notamment Chrome, Firefox et Safari, la méthode element.classList.add() fournit un moyen efficace d'ajouter une classe à un élément :

element.classList.add("my-class");

Pour supprimez la classe plus tard :

element.classList.remove("my-class");

Navigateurs hérités (propriété className)
Pour les navigateurs comme Internet Explorer 9 et versions antérieures, la propriété className de l'élément peut être utilisée pour ajouter une nouvelle classe :

var d = document.getElementById("div1");
d.className += " otherclass";

Assurez-vous qu'il y a un espace avant le nom de la nouvelle classe pour éviter de compromettre les classes existantes dans le list.

Remarque : La propriété element.className peut également être utilisée dans les navigateurs modernes, mais classList est généralement une approche plus propre et plus efficace.

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!