老师请帮我解答下问题...

// 声明全局变量 
var index = 0, // 当前显示图片索引,默认值为0;
    prev = byId("prev"), // 上一张
    next = byId("next"), // 下一张
    dots = byId("dots").getElementsByTagName("span"),
    pics = byId("banner").getElementsByTagName("div"), // 获取图片
    size = pics.length;
    

// 封装getElementById()
function byId(id) {
    return typeof(id) === "string" ? document.getElementById(id):id;
}


/* 封装通用事件绑定方法
        element绑定事件的Dom元素
        事件名
        事件处理程序
*/
function addHandle(element,type,handler) {
    // 非ie浏览器
    if(element.addEventListener) {
        element.addEventListener(type,handler,true)
    }
    // ie浏览器支持dom2级
    else if(element.attachEvent) {
        element.attachEvent("on" + type,handler)
    }
    // ie浏览器不支持dom2级
    else {
        element["on"+type] = handler;
    }
}

// 点击按钮显示下一张或上一张图片
/*
这个是dom零级事件绑定
next.onclick = function() {
    alert("123")
}
下面是dom二级事件

next.addEventListener("click", function(){
    alert("123");
});
next.addEventListener("click", function(){
    alert("456");
});

*/

//切换图片函数封装
function changeImg() {
    for(var i=0; i<size; i++) {
        pics[i].style.display = "none";
        dots[i].className = "";
    }
    pics[index].style.display = "block";
    dots[index].className = "active";

}

// 调用上面封装的事件绑定通用方法
//点击按钮切换图片
addHandle(prev,"click",function() {
    index--;
    if(index<0) index = size-1;
    changeImg()
});
addHandle(next,"click",function() {
    index++;
    if(index>=3) index = 0;
    changeImg()
});
// 图片索引小点点,点击小点点切换图片
for(var d=0; d<size; d++) {
    dots[d].setAttribute("data-id",d);
    addHandle(dots[d], "click", function(){
        index = this.getAttribute("data-id");
        // alert(index);
        changeImg()
    })
}

点击小点点 切换不了图片 不知道哪里出问题了