Maison > interface Web > Questions et réponses frontales > Comment vérifier si un objet a un certain style avec jquery

Comment vérifier si un objet a un certain style avec jquery

WBOY
Libérer: 2022-06-17 19:41:47
original
2354 Les gens l'ont consulté

Méthode : 1. Si le style est un style en ligne, vous pouvez utiliser la valeur de l'attribut style pour juger. La syntaxe est "var a = $(this).attr("style").indexOf("attribute". );if(a ! = (-1)){...}else{...}"; 2. Si le style est un style de classe, vous pouvez utiliser la classe pour juger. La syntaxe est "if(objet élément .attr("class").indexOf(" divclass")>0){...}else".

Comment vérifier si un objet a un certain style avec jquery

L'environnement d'exploitation de ce tutoriel : système Windows 10, jquery version 3.6.0, ordinateur Dell G3.

Comment vérifier si un objet a un certain style avec jquery

1 Si le CSS est écrit comme un style en ligne, il peut être jugé en obtenant la valeur de l'attribut style.

Déterminez si l'élément div avec l'ID divid a un style de taille de police :

<div id="divid" style="float:left; font-size:12px;"></div>
Copier après la connexion

Le code jquery est le suivant :

jQuery("#divid").each(function(){
  var fontSize = $(this).attr("style").indexOf("font-size");
  if(fontSize != (-1)){alert("已定义");}
  else{$(this).css({"float":"left","font-size":"12px"});}
});
Copier après la connexion

Remarque : s'il n'y a qu'un seul élément div avec l'ID divid, chacun de jquery ne sera exécuté que une fois.

2. Si le CSS est écrit comme un style de classe, il peut être jugé en obtenant la valeur de l'attribut de classe. L'exemple est le suivant :

Déterminez si l'élément div avec l'identifiant divise contient le style de classe. divclass :

.divclass{
background-color: #F33;
}
<div id="divid" class="divclass"></div>
Copier après la connexion

Le code jquery est le suivant :

jQuery("#divid").click(function(){
if(jQuery(this).attr("class").indexOf("divclass")>0){
    jQuery(this).removeClass("divclass")
}else{
    jQuery(this).addClass("divclass")
}
});
Copier après la connexion

Recommandation du didacticiel vidéo :

Tutoriel vidéo jQuery

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal