有3个蓝色的box,点击一个变黄色,点击第二个变黄色同时第一个恢复蓝色

3个蓝色的box,点击其中任意一个变黄色,再点击其他任意一个变黄色同时其他都回复蓝色,

点击的时候给当前一个box添加一个class,其它两个把class去了,如

<style>
.box{background:blue}
.box.active{background:yellow}
</style>
<div class="box active"></div>
<div class="box"></div>
<div class="box"></div>

原生js

var boxArr = document.getElementsByClassName('box');
for (var i = 0; i < boxArr.length; i++) {
  boxArr[i].onclick = function() {
    for (var j = 0; j < boxArr.length; j++) {
      boxArr[j].className = 'box'; // 先全部恢复默认class
    }
    this.className = 'box active'; // 再给当前点击添加class
  }
}

用jQuery的话要更方便点