检查元素是否具有在列表/数组中给定的类

Check if elements has class which is given in a list/array

本文关键字：数组 列表 是否 元素 检查      更新时间：2023-09-26

我需要将类.disabled添加到列表的特定元素中。这些元素可以在数组或类似的东西中找到——不知道推荐使用什么。

HTML:

<ul id=anything>
    <li><a href="javascript:;" class="re-icon re-deleted"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-bold"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-italic"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-table"></a> Text</li>
</ul>

这应该变成这样：

<ul id=anything>
    <li><a href="javascript:;" class="re-icon re-deleted"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-bold disabled"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-italic"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-table disabled"></a> Text</li>
</ul>

JS:

var arr = ['re-bold', 're-table'];
$('#anything a').each(function() {
    if ( $(this).hasClass('anything of the array') ) { // Check if this element has a class, which is given in the array
        $(this).addClass('disabled');
});

您可以手动或使用Array.prototype.map方法将.添加到数组的元素中。并连接数组的元素。然后filter方法将根据创建的选择器对匹配元素进行过滤：

var arr = ['.re-bold', '.re-table'];
$('#anything a').filter(arr.join()).addClass('disabled');

单向：

var arr = ['re-bold', 're-table'];
$('#anything a').each(function () {
    for (var i = 0; i < arr.length; i++) {
        if ($(this).hasClass(arr[i])) $(this).addClass('disabled');
    }
});

jsFiddle示例

产品：

<ul id="anything">
    <li><a href="javascript:;" class="re-icon re-deleted"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-bold disabled"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-italic"></a> Text</li>
    <li><a href="javascript:;" class="re-icon re-table disabled"></a> Text</li>
</ul>

只需遍历数组，即可检查每个类：

var arr = ['re-bold', 're-table'];
$('#anything a').each(function() {
    var i = 0, 
        arrayLength = arr.length;
    for(; i < arrayLength; i++){
        if ( $(this).hasClass(arr[i]) ) {
            $(this).addClass('disabled');
        }
    }
});

演示：http://jsfiddle.net/e6mds7vz/1/

相关文章：