<script>
var btns = document.querySelectorAll(".btn");
var inners = document.querySelectorAll("div");
/*
点击第 0 个按钮,需要 让第0个div 也对应显示
点击第 1 个按钮,需要 让第1个div 也对应显示
点击第 2 个按钮,需要 让第2个div 也对应显示
……
*/
// btns[0].id = 0;
// btns[1].id = 1;
for(var i = 0; i < btns.length; i++){
// btns[i].序号 = i;
btns[i].index = i; // 自定义属性 -- 索引值
btns[i].onclick = function(){
// 循环清除所有的选中状态
for(var i = 0; i < btns.length;i++){
btns[i].classList.remove("active");
inners[i].classList.remove("show");
}
this.classList.add("active");
//inners[this.序号].classList.add("show");
//console.log(this.id);
inners[this.index].classList.add("show");
};
}
</script>