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

Answer 2

Попробуйте это:

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