【问题标题】:jQuery Selecting Elements That Have Class A or B or CjQuery 选择具有 A 或 B 或 C 类的元素
【发布时间】:2011-11-07 15:07:54
【问题描述】:
我正在做一些需要两个功能的事情。
1 - 我需要查看同一父级下的一组子级,并基于类名“活动”,将该元素的 ID 添加到数组中。
['foo-a','foo-b','foo-d']
2 - 然后我遍历另一个父级中的所有子级,并且对于每个元素,我想找出它是否有任何与数组中的 id 匹配的类名。
这个元素是否有类 foo-a、foo-b 或 foo-d?
【问题讨论】:
标签:
javascript
jquery
arrays
class
jquery-selectors
【解决方案1】:
总是有.is('.foo-a, .foo-b, .foo-d')。或者,如果您实际上只是想选择它们,而不是对每个元素进行迭代和决定,$('.foo-a, .foo-b, .foo-d', startingPoint)。
【解决方案2】:
对于第一部分,我会使用map 和get:
var activeGroups = $('#parent .active').map(function() {
return this.id;
}).get();
这会为您提供一组 id 值(例如,['foo-a', 'foo-d'])。然后,您可以使用join 制作像.foo-a, .foo-b, .foo-c(multiple selector)这样的选择器:
var activeSelector = '.' + activeGroups.join(', .');
这会生成一个有效的 jQuery 选择器字符串,例如'.foo-a, .foo-d'。然后,您可以使用此选择器通过find 查找您想要的元素:
var activeEls = $('#secondParent').find(activeSelector);
然后您可以使用activeEls 做任何您需要做的事情。
【解决方案3】:
var active = $("#foo").find(".active").map(function() {
return this.id;
}).get();
$("#anotherParent *").each(function() {
var that = this;
var classes = $(this).attr("class");
if(classes.indexOf(" ") !== -1) {
classes = classes.split(" ");
} else {
classes = [ classes ];
}
$.each(classes, function(i, val) {
if($.inArray(val, active)) {
// this element has one of 'em, do something with it
$(that).hide();
}
});
});