下列实例是将轮播图所需要的图片封装在一个数组里，通过遍历实现图片的循环播放，并通过setInterval函数控制时间间隔。

HTML布局如下：

 

 

CSS布局如下：

.div1{
                   margin: 50px auto;                width: 80%;                height:300px;                text-align: center;            }             #imagescroll{
                   width: 534px;                height: 300px;            }

JS代码如下：

function imagechange(){    //获取承载图片的元素    var imagecontrol=document.getElementById("imagescroll");    //把所有的图片封装在一个数组中    var imageArr =["images/1.jpg","images/2.jpg","images/3.jpg","images/4.jpg"];    var index=0;    //通过setInterval函数每隔2秒改变一下图片，注意该函数的使用方法    setInterval(function(){        //获取当前图片的编号        var i =index;        //如果超过最大编号，则回滚到第一张图片        if(i>=imageArr.length){            index=0;            i=0;        }        //设置背景图片        imagecontrol.src=imageArr[i];        index=index+1;    },2000);}