VIP26/day12/js/4.选项卡.js

var btn = document.querySelectorAll("#list li");
var content = document.getElementsByClassName("active");
// this => window
for(var i=0; i<btn.length; i++) {
    // btn.length = 4
    // btn下的每一个下标都为对应的i
    console.log(btn[i].index)
    btn[i].index = i;
    console.log(btn[i].index)
    btn[i].onclick = function() {
        for(var j=0; j < content.length;j++){
            // className 改 class （类名）
            btn[j].className = '';
            content[j].className = 'active';
        }
        // this => btn[i]
        this.className = 'selected';
        content[this.index].className = "choose active";
    }
}