楼赛 第 31 期（Web 前端挑战）【功能实现】卡片化标签页

题目给出静态代码，运行如下图，无法实现卡片之间的切换，需要自己补全js代码

完善如下：

// 实现选项卡功能
function init() {
  // TODO 待补充代码
  var btns = document.querySelector(".tabs").querySelectorAll("div")
  var items = document.querySelector("#content").querySelectorAll("div")
  for(var i=0;i<btns.length;i++){
    btns[i].setAttribute('index',i)
    btns[i].onclick = function(){
      for(var i=0;i<btns.length;i++){
        btns[i].className=""
        
      }
      this.className = "active"

      var index = this.getAttribute("index")
      for(var i=0;i<items.length;i++){
        items[i].className=""
      }
      items[index].className="active"
    }
  }
}
init();

 主要就是考察tab栏的切换，运用排他思想，将要点击的添加上类，其余的去除类