Question

示例html：

<div class="red"></div>
<div class="green"></div>
<div class="blue"></div>

<div class="apple"></div>

如果他们没有“红色”，“绿色”或“蓝色”类，我想循环遍历div并过滤掉它们。

var onlyColorDivs = $('div').hasClass( __________ );

有没有办法填充上一行中的空白来完成此操作。或者我是否必须将我的列表颜色类放在一个数组中并进行循环？

如果需要澄清，请告诉我。

Answer 1

所有答案都很棒，也很合适。但是，如果您需要这样的函数，您还可以使用{Patch} hasClass方法来执行您想要的操作：

var _hasClass = $.fn.hasClass;
$.fn.hasClass = function (classNames) {
  if (!classNames || typeof classNames === "string" ) {
    return _hasClass.call(this, classNames); // Default behavior
  } else {
    // Take array and parse it for the filter method
    var classes = '.' + classNames.join(', .');
    return this.filter(classes).length > 0;
  }
};

然后你可以像这样使用它：

$("div").hasClass(['red','green','blue']);
// or
$("div").hasClass('green');

Demo on JS Bin

Answer 2

使用传统的选择方式有什么问题吗？

$(".red, .green, .blue");

如果您已经有想要过滤的收藏品，请说

$("div");

您可以使用上面提到的过滤器功能，但这样会慢一些，所以如果您有选择，请在单个选择器中对其进行编码。

扩展jQuery以获得已支持的功能，这种功能可以使用不同的语法。如果您坚持使用数组作为输入，选择器中的 join it 会更快：

var classes = new Array("red", "green", "blue");
$("div." + classes.join(",div."));

Answer 3

这将仅选择至少具有这3个类别之一的<div>元素。

试一试： http://jsfiddle.net/gADQn/

var onlyColorDivs = $('div.red, div.green, div.blue');

Answer 4

.filter('.red,.green,.blue')

应该做的工作。

或者只是最初选择它们：

$('.red,.green,.blue', context)

Answer 5

.filter（selector）是您正在寻找的功能。在选择的jQuery元素上调用此选项将优化选择与您提供的选择器匹配的元素。此外，您只需选择那些元素即可。

所以：$('div').filter('.red, .green, .blue');

或者：$('div.red, div.green, div.blue');

以下是使用过滤功能的文档：http://api.jquery.com/filter/

最后这里是使用它的演示：http://jsfiddle.net/Etb7R/

这个小脚本选择所有<div>并用它们的类属性的文本填充它们，然后过滤到只有那些类为“红色”，“绿色”或“蓝色”的脚本并应用一个额外的上课来突出他们。希望这能让您对自己的选择范围有所了解。

Answer 6

Determine if an element has a CSS class with jQuery

http://docs.jquery.com/Traversing/hasClass

如果一个元素至少有一个类，从指定的类列表中如何检查jQuery？

6 个答案: