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页面：

How do I test whether an element has perticular class or not

Answer 7

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

Answer 8

在我的情况下，我使用'是'一个jQuery函数，我有一个添加了不同css类的HTML元素，我在这些中间寻找一个特定的类，所以我使用了“是”一个好的替代检查动态添加到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();
    }

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

8 个答案: