確定元素是否具有帶有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();
    }