如果有同一组元素,我们想要某一个元素实现某种样式, 需要用到循环的排他思想算法:
- 所有元素全部清除样式(干掉其他人)
- 给当前元素设置样式 (留下我自己)
- 注意顺序不能颠倒,首先干掉其他人,再设置自己
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
var btns = document.querySelectorAll('button'); // 获取按钮
for (var i = 0; i < btns.length; i++) { // 遍历事件
btns[i].onclick = function() {
for (var j = 0; j < btns.length; j++) { // 先把所有的按钮颜色去掉 干掉所有人
btns[j].style.backgroundColor = '';
}
this.style.backgroundColor = 'red'; // 再设置自己的样式 留下自己
}
}