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_]")

关于如何做到这一点有什么想法吗？

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);
})