在JavaScript中检查元素是否包含类?

使用纯JavaScript(不是jQuery)，是否有任何方法来检查元素是否包含类?

目前，我正在这样做:

var test = document.getElementById("test"); var testClass = test.className; switch (testClass) { 例“class1”: 测试。innerHTML = "我有class1"; 打破; 例“class2”: 测试。innerHTML = "I have class2"; 打破; 例“class3”: 测试。innerHTML = "I have class3"; 打破; “一年级”情况: 测试。innerHTML = "I have class4"; 打破; 默认值: 测试。innerHTML = ""; ｝ <div id="test" class="class1"></div>

问题是，如果我把HTML改成这个…

<div id="test" class="class1 class5"></div>

.．.不再有一个精确的匹配，所以我得到的默认输出为nothing("")。但我仍然希望输出为I have class1，因为<div>仍然包含。class1类。

当前回答

我知道有很多答案，但其中大多数是额外的函数和额外的类。这是我个人使用的;更干净，代码行更少!

if( document.body.className.match('category-page') ) { 
  console.log('yes');
}

2015-12-21 07:58:48

其他回答

下面是一个不区分大小写的简单解决方案:

function hasClass(element, classNameToTestFor) {
    var classNames = element.className.split(' ');
    for (var i = 0; i < classNames.length; i++) {
        if (classNames[i].toLowerCase() == classNameToTestFor.toLowerCase()) {
            return true;
        }
    }
    return false;
}

2011-05-05 13:57:07

我认为完美的解是这个

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

2014-01-06 09:17:23

在哪个元素中当前是类的。酒吧”?这里有另一个解决方案，但取决于你。

var reg = /Image/g, // regexp for an image element
query = document.querySelector('.bar'); // returns [object HTMLImageElement]
query += this.toString(); // turns object into a string

if (query.match(reg)) { // checks if it matches
  alert('the class .bar is attached to the following Element:\n' + query);
}

jsfiddle演示

当然，这只是查找一个简单的元素<img>(/Image/g)，但您可以将所有元素放在一个数组中，如<li> is / li /g， <ul> = / ul /g等。

2016-07-05 21:05:32

我知道有很多答案，但其中大多数是额外的函数和额外的类。这是我个人使用的;更干净，代码行更少!

if( document.body.className.match('category-page') ) { 
  console.log('yes');
}

2015-12-21 07:58:48

这里有一个小片段，如果你试图检查元素是否包含一个类，而不使用jQuery。

function hasClass(element, className) {
    return element.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(element.className);
}

这说明元素可能包含多个用空格分隔的类名。

您还可以将此函数分配给元素原型。

Element.prototype.hasClass = function(className) {
    return this.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(this.className);
};

并像这样触发它(非常类似于jQuery的.hasClass()函数):

document.getElementById('MyDiv').hasClass('active');

2015-05-28 09:13:34

在JavaScript中检查元素是否包含类?

推荐文章

最新文章

标签