Javascript 更改阵列中的背景色元素

分页功能：如果用户单击数组中的任何元素，我想更改背景颜色。我可以通过下面的代码实现这一点，但当我单击此数组中的其他元素时，我希望先前单击的元素和其余元素使用原始

pagins

class。有人能给我指一下方向吗

.pagins a{
颜色：#fff；
背景色：#009de0；
}
.testClass{
背景色：#fff！重要；
颜色：#009de0！重要；
}

var elements=document.getElementsByClassName（'pagins'）；
$.each（元素、函数（）{
$（元素）。单击（函数（）{
$（this.addClass（'testClass'）；
});
})

删除所有元素中的

testClass

，然后再将其添加到所选元素中

  $.each(elements, function(){
        $(elements).click(function() {
            $(elements).removeClass('testClass');      
            $(this).addClass('testClass');                                          
        });
    });

$('.pagins').click(function(){
    $('.pagins.testClass').removeClass('testClass');
    $(this).addClass('testClass');
});

---

只要稍微简化一下代码，就可以做到这一点-

$(".testClass").removeClass("testClass");
$(".pagins").click(function() {
    $(this).addClass('testClass');
});

提供类选择器时，将对该类的所有元素应用单击功能。

不要使用

$。each（）

，这是jQuery中循环的一种方式。每次单击都会多次调用单击处理程序

您使用的是jQuery，所以不要使用

document.getElementsByClassName（'pagins'）

。只需使用

$（'.pagins'）

听起来您只希望最近单击的

.pagins

元素具有

testClass

类。因此，在将类添加到单击的元素之前，请从所有

.pagins.testClass

元素中删除该类

  $.each(elements, function(){
        $(elements).click(function() {
            $(elements).removeClass('testClass');      
            $(this).addClass('testClass');                                          
        });
    });

$('.pagins').click(function(){
    $('.pagins.testClass').removeClass('testClass');
    $(this).addClass('testClass');
});

---

请注意，每次调用都应删除

$。您的
每个
循环都没有意义。jQuery
单击
方法本身在集合中迭代。您当前正在为每个元素绑定多个单击处理程序，这是毫无意义的！