如何做jQuery的hasClass与平原ol ' JavaScript?例如,

<body class="foo thatClass bar">

JavaScript中询问<body>是否有thatClass的方法是什么?


当前回答

其中最有效的一句话就是

返回一个布尔值(与Orbling的答案相反) 在具有class="thisClass-suffix"的元素上搜索thisClass时,不会返回假阳性。 能兼容IE6以下的所有浏览器吗


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

其他回答

hasClass功能:

HTMLElement.prototype.hasClass = function(cls) {
    var i;
    var classes = this.className.split(" ");
    for(i = 0; i < classes.length; i++) {
        if(classes[i] == cls) {
            return true;
        }
    }
    return false;
};

addClass功能:

HTMLElement.prototype.addClass = function(add) {
    if (!this.hasClass(add)){
        this.className = (this.className + " " + add).trim();
    }
};

removeClass功能:

HTMLElement.prototype.removeClass = function(remove) {
    var newClassName = "";
    var i;
    var classes = this.className.replace(/\s{2,}/g, ' ').split(" ");
    for(i = 0; i < classes.length; i++) {
        if(classes[i] !== remove) {
            newClassName += classes[i] + " ";
        }
    }
    this.className = newClassName.trim();
};

/ / 1。使用if来查看这些类: if (document.querySelector(".section-name").classList.contains("section-filter")) { 警报(“网格部分”); / /代码… } < !——2。在.html:——>中添加一个类 <div class="section-name section-filter">

可以使用以下语句:

Array.prototype.indexOf.call(myHTMLSelector.classList, 'the-class');

存储正在使用的类的属性是className。

所以你可以说:

if (document.body.className.match(/\bmyclass\b/)) {
    ....
}

如果你想要一个显示jQuery如何做所有事情的位置,我建议:

http://code.jquery.com/jquery-1.5.js

只需使用classList.contains():

if (document.body.classList.contains('thatClass')) {
    // do some stuff
}

classList的其他用途:

document.body.classList.add('thisClass');
// $('body').addClass('thisClass');

document.body.classList.remove('thatClass');
// $('body').removeClass('thatClass');

document.body.classList.toggle('anotherClass');
// $('body').toggleClass('anotherClass');

浏览器支持:

Chrome 8.0 Firefox 3.6 IE 10 Opera 11.50 Safari 5.1

浏览器支持