以什么开头的JQuery类名选择器？

Question

我有以下的 HTML 标记：

<DIV class="bubble bubble_white">
  <DIV class=bubble_large></DIV>
</DIV>
<DIV class="bubble bubble_black">
  <DIV class=bubble_large></DIV>
</DIV>

我想选择类名为 bubble bubble_white 和 bubble bubble_black 的元素。我考虑使用下面的代码，但它没有起作用：

$(".bubble.[class^=bubble_]")

你有什么好的方法吗？

- Martijn

Answer 1

[attr^=val] 选择器是比较整个属性值。所以你的属性值必须以 bubble_ 开头才能被选中。对于一个以空格分隔的列表，你可以使用 [attr|=val] 选择器：

$(".bubble[class|=bubble_white], .bubble[class|=bubble_black]")

或者您可以自己进行过滤：

$(".bubble").filter("[class|=bubble_white], [class|=bubble_black]")

或者：

$(".bubble").filter(function() {
    var $this = $(this);
    return $this.hasClass("bubble_white") || $this.hasClass("bubble_black");
})

或者：

$(".bubble").filter(function() {
    return /(?:^|\s+)bubble_/.test(this.className);
})

- Gumbo

Answer 2

试试这个：

$(".bubble[class*=bubble_]")

- PetersenDidIt

---

请注意，这也会匹配类似于“foobubble_bar”这样的内容。 - Gumbo