原生js判断某个元素是否有指定的class名的几种方法

JavaScript030

原生js判断某个元素是否有指定的class名的几种方法,第1张

如果不考虑兼容IE10以下的话,可以用HTML5中的classList API,非常方便:

var node = document.getElementById('demo')

if(node.classList.contains('test')){

console.log('包含 test 这个class')

}

兼容的方式是采用className和getAttribute('class')方法:

if (node.getAttribute('class')) { // 存在class属性

// 方式1

if (node.getAttribute('class').indexOf('test') >-1) {

console.log('包含 test 这个class')

}

// 方式2

if (node.className.indexOf('test') >-1) {

console.log('包含 test 这个class')

}

}

<!DOCTYPE html> 

<html>

<head>

   <meta http-equiv="content-type" content="text/htmlcharset=gbk" />

</head>

<body>

<a class="a b c" id="ids">13579</a>

</body>

 <script>

   var ids=document.getElementById('ids').className

   ids.split(' ')

    for(i=0i<=ids.lengthi++){

       if(ids[i]=='b'){

          alert("存在该class")break

       }

    }

 </script>

</html>

用if判断以及hasClass取class就可以实现

if($("div").hasClass("classname")){}

定义和用法

hasClass() 方法检查被选元素是否包含指定的 class。

语法:

$(selector).hasClass(class)

返回值

hasClass()函数的返回值是Boolean类型,返回表示是否包含指定css类名的boolean值,如果包含就返回true,否则返回false。

如果当前jQuery对象匹配多个元素,只要其中有任意一个元素含有指定的css类名,就返回true。