如何select所有class以GB开头的元素？

Question

我有一个项目，我想在其中 select 所有具有以下 class 的元素：
.GB1, .GB2, .GB3, .GB4, .GB5 这将持续到 .GB400.
我还有其他元素包含以下类型的 classes .GB, .GBholder, .GB_color, .GB-size，我不想 select 这个元素。我没有任何其他元素 classes 以 .GB 开头并且在 .GB 之后它有像 .GB1 或 GB20 这样的数字。所以我有一个想法。但是我不知道如何使用 jquery 或 javascript.The 来做到这一点，想法是 "I Will tell the browser that, select all the elements that started with .GB and after .GB It have one or many numbers." 可能吗？我怎样才能通过 js 或 jquery 做到这一点？

这是我现在正在尝试的代码：

$('.color').on('click', function() {
    $('*[class^="GB"]').css("background-color","red");
})

我已经用这个 class 写完了所有的 html 和一些很长的 css。所以更改此 class 名称将花费太多时间。

Answer 1

您可以使用 filter() 和 isNaN() 方法，如下所示。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="GB1">GB1</div>
<div class="GB2">GB2</div>
<div class="GB3">GB2</div>
<div class="GBholder">GB holder</div>
<div class="GB_color">GB color</div>
<input type="button" value="Click" class="color"/>

<script>
    $('.color').on('click', function () {
        $('[class^="GB"]').filter(function () {
            return isNaN($(this).attr('class').slice(2)) == false;

            //if your elements has more than one class then add GB first and try this
            //var cl = $(this).attr('class').split(' ')[0];
            //return isNaN(cl.slice(2)) == false;
        }).css("background-color", "red");
    })
</script>

如何select所有class以GB开头的元素？

How to select all the elements which class starts with GB?

javascript

jquery

selector

jquery-selectors