确定元素是否具有带有jQuery的CSS类

Question

我正在使用jQuery并查看是否有一种简单的方法来确定该元素是否具有与之关联的特定CSS类。

我有元素的id，以及我正在寻找的CSS类。 我只需要能够在if语句中根据元素上该类的存在进行比较。

Answer 1

使用hasClass方法：

jQueryCollection.hasClass(className);

要么

$(selector).hasClass(className);

该参数（显然）是一个表示您正在检查的类的字符串，它返回一个布尔值（因此它不像大多数jQuery方法那样支持链接）。

注意：如果传递包含空格的className参数，则它将按照字面意义与集合的元素的className字符串进行匹配。 所以，例如，如果你有一个元素，

<span class="foo bar" />

然后这将返回true ：

$('span').hasClass('foo bar')

这些将返回false ：

$('span').hasClass('bar foo')
$('span').hasClass('foo  bar')

Answer 2

来自FAQ

elem = $("#elemid");
if (elem.is (".class")) {
   // whatever
}

要么：

elem = $("#elemid");
if (elem.hasClass ("class")) {
   // whatever
}

Answer 3

至于否定，如果你想知道一个元素是否没有一个类，你就可以像马克所说的那样做。

if (!currentPage.parent().hasClass('home')) { do what you want }

Answer 4

没有jQuery：

var hasclass=!!(' '+elem.className+' ').indexOf(' check_class ')+1;

要么：

function hasClass(e,c){
    return e&&(e instanceof HTMLElement)&&!!((' '+e.className+' ').indexOf(' '+c+' ')+1);
}
/*example of usage*/
var has_class_medium=hasClass(document.getElementsByTagName('input')[0],'medium');

这比jQuery更快！

Answer 5

为了帮助任何落在这里但实际上正在寻找jQuery免费方式的人：

element.classList.contains('your-class-name')

Answer 6

查看官方jQuery FAQ页面：

如何测试元素是否具有特定类

Answer 7

 $('.segment-name').click(function () {
    if($(this).hasClass('segment-a')){
        //class exist
    }
});

Answer 8

在我的情况下，我使用'是'一个jQuery函数，我有一个HTML元素添加了不同的css类，我在这些中间寻找一个特定的类，所以我使用“是”一个很好的替代检查一个动态添加到html元素的类，它已经有其他css类，这是另一个很好的选择。

简单的例子：

 <!--element html-->
 <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom cbp-spmenu-open" id="menu">somethings here... </nav>

 <!--jQuery "is"-->
 $('#menu').is('.cbp-spmenu-open');

高级示例：

 <!--element html-->
    <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom cbp-spmenu-open" id="menu">somethings here... </nav>

   <!--jQuery "is"-->
    if($('#menu').is('.cbp-spmenu-bottom.cbp-spmenu-open')){
       $("#menu").show();
    }