在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. Ubuntu安装SSH服务

    1 SSH服务 Ubuntu默认并没有安装ssh服务,如果通过ssh远程连接到Ubuntu,需要自己手动安装ssh-server(openssh-server). 1.1 检测是否安装SSH服务 出现 ...

  2. Composite模式

    1 意图:将对象组成树形结构,以表示“部分——整体”的层次结构.Composite使得用户对单个对象和组合对象的使用具有一致性. 2 动机:同意处理图元对象和包含图元的容器对象.Composite通过 ...

  3. 【转】 TCP协议中的三次握手和四次挥手(图解)

    建立TCP需要三次握手才能建立,而断开连接则需要四次握手.整个过程如下图所示: 先来看看如何建立连接的. 首先Client端发送连接请求报文,Server段接受连接后回复ACK报文,并为这次连接分配资 ...

  4. [maven] 使用Nexus创建maven私有仓库

    1.为什么需要maven私有仓库? 从Maven中央仓库下载所需的jar包,需要外网的支持.如果公司不能上外网的话则不能从中央仓库下载所需jar包,公司网速慢的时候也会影响项目构建的速度.用户可以用n ...

  5. python中lambda表达式应用

    对于简单的函数,也存在一种简便的表示方式,即:lambda表达式 #普通函数1 def func(a): return a+1 print 'test1_func0:',func(1000)4#lam ...

  6. sql server 自增长id 允许插入显示值

    --允许插入显示插入主键id的值SET IDENTITY_INSERT [T0002_SType] ON 执行insert插入语句------------------ --关闭 插入显示值SET ID ...

  7. C# 字符串转义和反转义

    System.Text.RegularExpressions.Regex.Unescape(s) System.Text.RegularExpressions.Regex.Escape(s)

  8. Octopus系列之代码备份

    代码 $.extend($.validator.messages, { required: "This field is required.", remote: "Ple ...

  9. at

    1.这个命令对于自己建立的虚拟机很有帮助,比如你想过半个小时关机: [root@oc3408554812 ~]# at now + 30 minutesat> cd /tmp -h nowat& ...

  10. centos 非可视化查看已安装的redis

    1. 2.