老师有问题

var index=0,

// 当前显示图片的索引，默认值为0

prev=byId("prev"),  //上一张

next=byId("next"),

pics=byId("banner").getElementsByTagName("div"),

size=pics.length,

dots=byId("dots").getElementsByTagName("span");

; //下一张

//封装getElementById()

function byId(id){

return typeof(id)==="string"?document.getElementById(id):id;

}

//点击下一张显示下一张图片

next.addEventListener("click",function(){

index++;

if(index>=size) index=0;

//pics[0].style.display="none";

//pics[1].style.display="none";

//因为父级设置了溢出隐藏的属性，所以里面的图片的宽高如果是大于父级的宽高，则图片会被隐藏

//又因为设置了全部隐藏的属性，但是页面第一张是存在的，如果第一张一直是块级元素的话

//他撑满父级盒子，其他的兄弟元素图片是不显示的，但是当他点击以后，设置属性为None

for(var i=0;i<size;i++){

pics[i].style.display="none";

dots[i].className="none";

}

pics[index].style.display="block";

//先决条件是 前一张图片为NONE了 这一张INDEX+1对应的正好是第二张 将他用block属性显示

dots[index].className="active";

});就是如何理解图片和按钮的显示隐藏 就是过程我不太懂 原理懂一点点 我设置的CLSS ID都和老师的一样 实现效果没问题 就是我不懂这个过程听不太明白