jquery - jQuery 选择器帮助 - 或，和

Question

我正在尝试创建一个 jQuery 选择器，它将执行以下操作：

(.a OR .b OR .c) AND (.x OR .y OR .z)

显然，这不起作用：

$("(.a,.b,.c)(.x,.y,.z)")

我需要在单个选择器中使用它，以便可以将它用作 Isotope 插件中的过滤器。http://isotope.metafizzy.co/docs/filtering.html

这是我想要实现的示例：http: //isotope.metafizzy.co/demos/combination-filters.html，只有我希望能够选择红色和蓝色。这可能吗？

谢谢！

Answer 1

通过扩展AND（它基本上是笛卡尔积），这相当于：

.a.x OR .a.y OR .a.z OR .b.x OR .b.y OR .b.z OR .c.x OR .c.y OR .c.z

所以只需用ORs替换,s ，你就有了一个选择器：

$('.a.x, .a.y, .a.z, .b.x, .b.y, .b.z, .c.x, .c.y, .c.z')

Answer 2

您可以:not()使用De Morgan 定律来做到这一点（即，您使用双重否定将 AND 转换为 OR，而不是扩展您的逻辑公式）：

:not(:not(.a, .b, .c), :not(.x, .y, .z))

jsFiddle的工作示例。我正在应用的转换是：

a AND b ==> not(not(a AND b))
        ==> not((not a) OR (not b))

Answer 3

您可以创建一个返回字符串的表达式

演示：http: //jsfiddle.net/sq4xF/

var parents=['a','b','c']
var kids=['c','d','e']

var selector=[];
for ( i=0; i<parents.length; i++){
   var sel='.'+parents[i] ;
    for (j=0; j<kids.length; j++){
       selector.push( sel+"."+kids[j]);  /* add space if kids are desecendents, "AND" was not clear in question*/
    }
}

$("'"+ selector.join()+"'").css('color','red')