JQ判断一个元素是否具有某个class
墨初 前端设计 7982阅读
在前端某些个逻辑中,我们需要判断某个元素是否具有某个class的值,并对其挂载相应的事件。这篇文章就说说利用JQ中的hasClass方法来判断某个元素是否具有某个类
hasClass定义与用法
hasClass() 方法检查被选元素是否包含指定的 class。
如果被选元素包含指定的类,该方法返回 "true"。
语法:
$(selector).hasClass(class)
class:为要查找的类,不可省略
JQ判断某个元素中是否具体某个类
例1:
代码
<div id="mochu" class="aa bb">飞鸟慕鱼博客</div> <button>点我测试</button> <script> $('button').click(function(){ alert($('#mochu').hasClass('aa')); }); </script>
弹出结果:true;
例2:
<div id="mochu" class="aa bb">飞鸟慕鱼博客</div> <button>点我测试</button> <script> $('button').click(function(){ alert($('#mochu').hasClass('aa bb')); }); </script>
弹出结果:true
例3:
<div id="mochu" class="aa bb">飞鸟慕鱼博客</div> <button>点我测试</button> <script> $('button').click(function(){ alert($('#mochu').hasClass('aa cc')); }); </script>
弹出结果:false
总结:
通过上面的三个例子相比较,我们不难发现hasClass()方法可以同时写多个class,但他们之前用空格隔开。只有所填写的类全部存在才会返回true,否则返回false