在jQuery中可以使用2种方法来判断一个元素是否包含一个确定的类(class)。两种方法有着相同的功能。2种方法如下：（个人喜欢用hasClass()）

1.           hasClass(‘classname’)

2.           is(‘.classname’)

以下是一个div元素是否包含一个redColor的例子：

1. 使用is(‘.classname’)的方法

$('div').is('.redColor')

2. 使用hasClass(‘classname’)的方法(注意jquery的低版本可能是hasClass(‘.classname’))

$('div').hasClass('redColor')

以下是检测一个元素是否含有一个redColor类的例子，含有时，则把其类变为blueColor。

<html>
<head>
<styletype="text/css">
  .redColor { 
        background:red;
  }
  .blueColor { 
        background:blue;
  }
</style>
<scripttype="text/javascript"src="jquery-1.3.2.min.js"></script>
</head>
<body>
  <h1>jQuery check if an element has a certain class</h1>
 
  <divclass="redColor">This is a div tag with class name of "redColor"</div>
 
  <p>
  <buttonid="isTest">is('.redColor')</button>
  <buttonid="hasClassTest">hasClass('.redColor')</button>
  <buttonid="reset">reset</button>
  </p>
<scripttype="text/javascript">
 
    $("#isTest").click(function () {
 
          if($('div').is('.redColor')){
                $('div').addClass('blueColor');
          }
 
    });
 
    $("#hasClassTest").click(function () {
 
          if($('div').hasClass('redColor')){
                $('div').addClass('blueColor');
          }
 
    });
 
        $("#reset").click(function () {
          location.reload();
    });
 
 
</script>
</body>
</html>

初始效果：

点击is('.redColor')后的效果：

点击hasClass('redColor')的效果与点击is('.redColor')后的效果相同，点击reset的效果与初始效果相同。

怎么使用jquery判断一个元素是否含有一个指定的类（class）的更多相关文章

  1. 如何使用jquery判断一个元素是否含有一个指定的类（class）

    如何使用jquery判断一个元素是否含有一个指定的类(class) 一.总结 一句话总结:可以用hasClass方法(专用)和is方法 1.is(expr|obj|ele|fn)的方法几个参数表示什么 ...

  2. js和jquery判断该元素中是否有指定class

    <div class="test">test</div> var t = document.getElementsByClassName('test'); ...

  3. jQuery判断当前元素是第几个元素&获取第N个元素

    假设有下面这样一段HTML代码: <ul> <li>jQuery判断当前元素是第几个元素示例</li> <li>jQuery获取第N个元素示例</ ...

  4. javascript判断一个元素是另外一个元素的子元素

    javascript判断一个元素是另外一个元素的子元素用途有很多,最常用的就是当点击页面的空白处去执行某些操作,比如弹出层等. function isParent (obj,parentObj){ w ...

  5. js jquery 判断匹配元素是否存在

    jQuery 判断页面元素是否存在的代码 在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的. 例如: 复制代码 ...

  6. [ jquery 过滤器 hasClass(class) ] 此方法用于在选择器的基础之上检查当前的元素是否含有某个特定的类，如果有，则返回true

    此方法用于在选择器的基础之上检查当前的元素是否含有某个特定的类,如果有,则返回true 实例: <!DOCTYPE html> <html lang='zh-cn'> < ...

  7. js 获取任意一个元素的任意一个样式属性的值

    //谷歌,火狐支持console.log(window.getComputedStyle(my$("dv"),null).left);//IE8支持console.log(my$( ...

  8. jQuery 判断页面元素是否存在的代码

    在原生的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的. 例如: document.getElementById(& ...

  9. jQuery判断当前元素显示状态并控制元素的显示与隐藏

    1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible');   //true为显示,false为隐藏 $("#id") ...

随机推荐

  1. iOS 二维数组排序小算法

    NSArray *tmp = @[@[@(1), @(2), @(3), @(4), @(5)],                     @[@(6), @(7), @(8), @(9), @(10 ...

  2. C# 使用HttpWebRequest通过PHP接口 上传文件

    1:上传文件实例 public void UploadXMLLog(string xmlpath)         {             NameValueCollection nvc = ne ...

  3. 原！！mybatis如何直接 执行传入的任意sql语句 并按照顺序取出查询的结果集

    需求: 1.直接执行前端传来的任何sql语句,parameterType="String", 2.对于任何sql语句,其返回值类型无法用resultMap在xml文件里配置或者返回 ...

  4. WebView注入Java对象注意事项

    在android4.2以前,注入步骤如下: webview.getSetting().setJavaScriptEnable(true); class JsObject { public String ...

  5. gitd模式-主从备份恢复

    主从节点分配: 192.168.1.100 master binlog server读取节点 192.168.1.101 slave 备份节点 备注:binlog server从master节点备份b ...

  6. nodejs 框架安装生成app

    下载nodejs解压到opt目录$ cd /usr/local/bin$ sudo ln -s /opt/node-v5.1.0-linux-x64/bin/node$ sudo ln -s /opt ...

  7. Linux学习 ： 裸板调试 之 配置使用NAND FLASH

    关于NAND FLASH的结构是以页为单位写,以块为单位来擦除: 1Gb     为大页   page=2048Kb    BLOCK=128K 512Mb 为小页   page=512byte   ...

  8. android 分享或者调用系统或者其他app时 应注意！ startActivityForResult() 使用

    //判断是否有相应的Activity来接受intentPackageManager packageManager = getPackageManager();List<ResolveInfo&g ...

  9. 在可以调用OLE之前，必须将当前线程设置为单线程单元（STA）模式，请确保您的Main函数带有STAThreadAttribute

    导入导出功能,在调用ShowDialog时的错误,解决办法如下: WinForm窗体的入口点: /// <summary> /// 应用程序的主入口点. /// </summary& ...

  10. HTTP协议，操作方法的幂等、安全性

    google了一些中文的资料, 基本了解了幂等是怎么回事儿. 备忘一下. PUT,DELETE操作是幂等的.所谓幂等是指不管进行多少次操作,结果都一样.比如我用PUT修改一篇文章,然后在做同样的操作, ...