OUJOOD.COM
Définition et Usage La méthode hasClass()
jQuery cours tutorialLa méthode .hasClass() vérifie si un des éléments sélectionnés a une classe spécifiée.
Si aucun des éléments sélectionnés a la classe spécifiée, cette méthode renvoie true .
Syntaxe :
$(sélecteur).hasClass(class)
| Paramètre | Description |
|---|---|
| classe | Obligatoire. Spécifie la classe rechercher dans les éléments sélectionnés |
Exemple : Vérifier si un élément p a une classe intro
Exemple : 📝 Copier le code
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
if($("p").hasClass("intro")==true){$("span").text("Oui Il existe un élément p avec cette classe");}
else $("span").text("Non Il n'existe aucun élément p avec cette classe");
$("span").css("color","#ff0000");
});
});
</script>
<style type="text/css">
.intro
{
font-size:120%;
color:#f00;
}
</style>
</head>
<body>
<h1>Ceci est un titre</h1>
<p class="intro">Ceci est un
paragraphe.</p>
<p>Ceci est un autre paragraphe.</p>
<span> </span><br><br>
<button>Vérifier</button>
</body>
</html>
Les éléments html peuvent avoir plus d'une classe. En HTML, ceci représenté en séparant les noms de classe avec un espace comme suit :
<div id="mondiv" class="fee bac"></div>
La méthode .hasClass() retourne true si la classe est assignée un élément, même si d'autres classes lui sont aussi assignées. Par exemple, étant donné le code HTML ci-dessus, La méthode .hasClass() suivante retournera true :
$('#mondiv').hasClass('fee')
Comme le ferait aussi La méthode .hasClass() suivante :
$('#mondiv').hasClass('bac')
Alors que La méthode .hasClass() suivante retournera false :
$('#mondiv').hasClass('qqqx')
Par gerywa 25 juillet 2014