排他法的基础代码

// tab切换
var a = document.getElementsByClassName('a1');
var div = document.getElementsByClassName('box3');
for (var i = 0; i < a.length; i++) {
    a[i].setAttribute('index', i)
    a[i].onclick = function () {
        var index = this.getAttribute('index');
        for (var j = 0; j < a.length; j++) {
           // 如果有‘avtive’时删除‘avtive’
            a[j].classList.remove("active");
            // 在类名列表添加‘avtive’
            a[index].classList.add("active");
        }
        for (var k = 0; k < div.length; k++) {
            div[k].style.display = 'none'
            div[index].style.display = 'block'
        }
    }
}