Question

我有一个由cms生成的类js-bootstrap3。我需要做的是检查包含元素是否只有js-bootstrap3和.unwrap()内容，但如果元素有多个包含js-bootstrap3的类，那么我试图只是删除该课程。

$('.jsn-bootstrap3').each(function(){
    if( $(this).attr('class') !== undefined && $(this).attr('class').match(/jsn-bootstrap3/) ) {
        console.log("match");
        $(this).contents().unwrap();
        $(this).removeClass('jsn-bootstrap3');
    }
});

这似乎检测到js-bootstrap3作为类的任何元素并将其解包。

Answer 1

this.className是一个字符串，其中包含元素的所有类（以空格分隔），因此，如果它不仅仅是"jsn-bootstrap3"，您知道它有多个类：

$('.jsn-bootstrap3').each(function(){
    if( $.trim(this.className) !== "jsn-bootstrap3") {
        // Just jsn-bootstrap3
        $(this).contents().unwrap();
    } else {
        // More than just jsn-bootstarp3
        $(this).removeClass('jsn-bootstrap3');
    }
});

Answer 2

依赖于您需要支持element.classlist（IE10 +）的浏览器可能或可能不是您需要的。

classList返回元素的class属性的标记列表。

classList是通过element.className访问元素列表作为空格分隔字符串的便捷替代方法。它包含以下方法：

否则，您正在考虑将className拆分为数组，以便计算值：

var classes = element.className.split(" ");

根据你的例子，你可以做点什么：

$('.jsn-bootstrap3').each(function(i, el){
    if( el.className.indexOf('jsn-bootstrap3') != -1 ) {
        console.log("match");
        if ( el.className.split(" ").length > 1 ) {
            $(this).removeClass('jsn-bootstrap3');
        } else {
            $(this).contents().unwrap();
        }
    }
});

Answer 3

试试这段代码。

$(document).ready(function(){

    $('.jsn-bootstrap3').each(function(){

        var classes = $(this).attr('class');

        var new_cls = classes.split(' ');

        if( new_cls.length > 1 ){

            $(this).removeClass('jsn-bootstrap3');

        } else {

            $(this).contents().unwrap();

        }

    });

});

jQuery检查类是否存在或是否有多个类

3 个答案: