jquery检查集合/数组的任何元素是否有Class答案

【问题标题】：jquery check if any element of collection / array has Classjquery检查集合/数组的任何元素是否有Class
【发布时间】：2020-05-22 09:47:50
【问题描述】：

我正在尝试简化 jquery 代码。我有一些元素，我想检查这些元素中的任何一个是否具有特定的类，所有选择器的特定类是否相同。

if($(".sf-item-352").hasClass("sf-option-active") || $(".sf-item-356").hasClass("sf-option-active") || $(".sf-item-362").hasClass("sf-option-active")) {

     do_something();

} else {

     do_something_else();

}

上面的代码完美运行，但我想使用一个选择器数组，而不是为每个选择器编写一个条件（我可能需要检查很多选择器）。

这是我迄今为止一直在尝试的：

var elems = $(".sf-item-352, .sf-item-356", .sf-item-362");

elems.each(function() {

     if ($(this).hasClass("sf-option-active")) {

          do_something();

     } else {

          do_something_else();
     }

});

我显然没有得到相同的结果... 有人可以帮我吗？有什么建议吗？

谢谢

【问题讨论】：

标签： jquery arrays class if-statement

【解决方案1】：

如果您想使用选择器数组，可以将它们组合成一个多部分（逗号分隔）查询，然后使用filter() 查看是否有其他类：

let selectors = ['.foo', '.bar', '.etc'];
if ($(selectors.join(', ')).filter('.someClass').length) {
    //some have the class
}

【讨论】：

为什么是.filter(...).length？
@Andreas 因为这会将匹配的元素过滤为具有过滤器类的元素的子集，并且 .length 根据该子集是否包含 0（假）或非- 零个元素（真）。
.hasClass(): “确定任何匹配的元素是否被分配给给定的类。”
当然可以，但我的方法也很好用。使用 jQuery，就像生活一样，通常有上百万种方法可以实现相同的目标。随时使用hasClass() 发布您自己的答案。我更喜欢filter().length，因为它有更广泛的应用，而不仅仅是检查类。

【解决方案2】：

您的代码没有问题，但您有一些语法错误。这是一个工作代码：

const hasClass = $(".sf-item-352, .sf-item-356, .sf-item-362").hasClass("sf-option-active");
if (hasClass) {
  console.log("class exists");
} else {
  console.log("class does not exist");
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="sf-item-352">First div</div>
<div class="sf-item-356 sf-option-active">Second div</div>
<div class="sf-item-362">Third div</div>

【讨论】：

【解决方案3】：

改变

var elems = $(".sf-item-352, .sf-item-356", .sf-item-362");

进入 jQuery 对象数组：

var elems = [$(".sf-item-352"), $(".sf-item-356"), $(".sf-item-362")];

【讨论】：

为什么是三个独立的 jQuery 对象？然后 OP 如何检查类的存在？
我正在纠正他的代码不起作用，他说“这是我迄今为止一直在尝试的”