jquery - 带有和-或的多个过滤器

Question

说我有这个：

<div class="red square">...</div>
<div class="white square">...</div>
<div class="blue square">...</div>

<div class="red triangle">...</div>
<div class="white triangle">...</div>
<div class="blue triangle">...</div>

<div class="red circle">...</div>
<div class="white circle">...</div>
<div class="blue circle">...</div>

如何选择（红色或白色）和（圆形或方形）？

这似乎有效：

  $('div').filter('.red,.white').filter('.circle,.square').addClass('select');

但是如果过滤器是可变的（存储在对象中），可能只有颜色选择、单一形状或具有其他组（例如大小），例如：

filters = {color:".red,.blue", shape:".circle,.square"};
// or
filters = {color:".white", size:".medium,.small"};

 $('div').filter(filters[color]).filter(filters[shape]).filter(filters[size]).addClass('select');
// This won't work when one of the object key is absent. 

Answer 1

通过使用由关键字数组（组）组成的对象，然后使用过滤器检查每个组中是否至少有一个关键字匹配来解决。