jQuery中是否有一种方法可以循环遍历或分配给数组中所有被分配给元素的类?

ex.

<div class="Lorem ipsum dolor_spec sit amet">Hello World!</div>

我将寻找一个“特殊”类,如上面的“dolor_spec”。我知道我可以使用hasClass(),但实际的类名可能并不一定知道。


当前回答

更新:

正如@莱恩·伦纳德指出的那样,我的回答并没有真正解决我自己提出的问题……你需要修剪和删除双空格(例如)字符串。替换(/ +/g, " ")..或者你可以分开坐电车。然后使用(例如)arr.filter(Boolean)删除空值。

const classes = element.className.split(' ').filter(Boolean);

或者更现代

const classes = element.classList;

旧:

对于所有给出的答案,你不应该忘记使用.trim()(或$.trim())

因为类会被添加和删除,所以在类字符串之间可能会有多个空格。如。'class1 class2 class3'..

这将变成[class1, class2 ','','','', ' 类别3 ']. .

当你使用修剪,所有的多个空格被删除。

其他回答

你可以使用document.getElementById('divId').className.split(/\s+/);得到一个类名数组。

然后您可以迭代并找到您想要的。

var classList = document.getElementById('divId').className.split(/\s+/);
for (var i = 0; i < classList.length; i++) {
    if (classList[i] === 'someClass') {
        //do something
    }
}

jQuery在这里并不能真正帮助你…

var classList = $('#divId').attr('class').split(/\s+/);
$.each(classList, function(index, item) {
    if (item === 'someClass') {
        //do something
    }
});

感谢这一点-我有一个类似的问题,因为我试图通过编程将对象与分层类名联系起来,即使这些名称可能不一定是我的脚本所知道的。

在我的脚本中,我想要一个<a>标记通过给<a>标记[some_class]加上toggle的类来打开/关闭帮助文本,然后给它的帮助文本[some_class]_toggle的类。这段代码成功地找到了使用jQuery的相关元素:

$("a.toggle").toggle(function(){toggleHelp($(this), false);}, function(){toggleHelp($(this), true);});

function toggleHelp(obj, mode){
    var classList = obj.attr('class').split(/\s+/);
    $.each( classList, function(index, item){
    if (item.indexOf("_toggle") > 0) {
       var targetClass = "." + item.replace("_toggle", "");
       if(mode===false){$(targetClass).removeClass("off");}
       else{$(targetClass).addClass("off");}
    }
    });
} 

javascript为dom中的节点元素提供了classList属性。简单的使用

  element.classList

将返回form对象

  DOMTokenList {0: "class1", 1: "class2", 2: "class3", length: 3, item: function, contains: function, add: function, remove: function…}

该对象具有您可以使用的包含、添加、删除等函数

你应该试试这个:

$("selector").prop("classList")

它返回元素当前所有类的列表。

获取应用于元素的类列表,我们可以使用

$('#elementID').prop('classList')

要添加或删除任何类,我们可以按照下面的步骤。

$('#elementID').prop('classList').add('yourClassName')
$('#elementID').prop('classList').remove('yourClassName')

为了简单地检查类是否存在,我们可以使用hasClass