迭代相同元素上的类

Question

如果我有一个div，它有多个类分配给class属性，是否可以使用jQuery中的each()函数迭代它们？

<div class="class1 differentclassname anotherclassname"><div>

Answer 1

在JavaScript中，要获取类列表，可以使用

• .className.split(' ')，返回Array
• （HTML5）.classList，返回DOMTokenList

在jQuery中，您可以使用.prop()获取className或classList属性。

要迭代它们，您可以使用：

• for循环，例如for(var i=0; i<classes.length; ++i)
• （ES6）一个for...of循环，例如for(var cl of classes)。
• （ES5）forEach，仅适用于数组，例如classes.forEach(fn)
• （jQuery）$.each，例如$.each(classes, fn)

如果您使用classList但希望使用forEach进行迭代，则可以使用

将DOMTokenList转换为Array

• [].slice.call(classes)
• （ES6）Array.from(classes)

Answer 2

首先，您需要获取包含以下类的字符串：

$('div').attr('class');

并用空格分隔它以获得一个数组：

$('div).attr('class').split(' ');

然后使用该数组作为$ .each函数的第一个参数，其中索引和值可以帮助您独立处理它

$.each($('div').attr('class').split(' '), function(index, value) {
    console.log('Class name ' + value);
});