Element.matches ()

元素匹配(selectorString)。

根据MDN Web Docs:

如果元素将被指定的选择器字符串选中，则element .matches()方法返回true;否则，返回false。

因此，您可以使用element .matches()来确定元素是否包含类。

const element = document.querySelector('#example'); console.log (element.matches (' . foo '));/ /正确的 <div id="example" class="foo bar"></div>

查看浏览器兼容性

一个简化的联机程序:1

function hasClassName(classname,id) {
 return  String ( ( document.getElementById(id)||{} ) .className )
         .split(/\s/)
         .indexOf(classname) >= 0;
}

IE当然不支持数组的1 indexOf。网上有很多猴子补丁。

因为他想使用switch()，我很惊讶没有人提出这个:

var test = document.getElementById("test");
var testClasses = test.className.split(" ");
test.innerHTML = "";
for(var i=0; i<testClasses.length; i++) {
    switch(testClasses[i]) {
        case "class1": test.innerHTML += "I have class1<br/>"; break;
        case "class2": test.innerHTML += "I have class2<br/>"; break;
        case "class3": test.innerHTML += "I have class3<br/>"; break;
        case "class4": test.innerHTML += "I have class4<br/>"; break;
        default: test.innerHTML += "(unknown class:" + testClasses[i] + ")<br/>";
    }
}

我认为完美的解是这个

if ($(this).hasClass("your_Class")) 
    alert("positive");            
else              
    alert("Negative");

我将保利填充classList功能，并使用新的语法。这样，新的浏览器将使用新的实现(速度快得多)，只有旧的浏览器会受到代码的性能影响。

https://github.com/remy/polyfills/blob/master/classList.js

使用元素。contains方法:

element.classList.contains(class);

这适用于所有当前的浏览器，也有支持旧浏览器的腻子。

Alternatively, if you work with older browsers and don't want to use polyfills to fix them, using indexOf is correct, but you have to tweak it a little:

function hasClass(element, className) {
    return (' ' + element.className + ' ').indexOf(' ' + className+ ' ') > -1;
}

否则，如果您正在寻找的类是另一个类名的一部分，也会得到true。

DEMO

jQuery使用类似的(如果不是相同的)方法。

应用于本例:

因为这不能和switch语句一起工作，你可以用下面的代码达到同样的效果:

var test = document.getElementById("test"),
    classes = ['class1', 'class2', 'class3', 'class4'];

test.innerHTML = "";

for(var i = 0, j = classes.length; i < j; i++) {
    if(hasClass(test, classes[i])) {
        test.innerHTML = "I have " + classes[i];
        break;
    }
}

它也更少冗余;)