之前的博文：JS点击上一张下一张轮播li标签1、
是通过点击按钮切换上一张下一张图片，这个是手动操作的，JS里还有定时器可以设置每隔多少时间执行一次。
例如之前博文的那个，把下一张的next()方法，挂到定时器上，每隔一秒执行一次这个next()方法，就可以实现每隔一秒自动切换图片。
格式：setInterval(方法，时间）；
例如 ：setInterval(next(),1000);//每隔一秒执行一次next()方法。
这里的1000单位是毫秒，秒和毫秒的换算单位为：1秒=1000毫秒。
测试代码：这里用log输出下时间，测试下每次执行的方法的时间。定时器前面的代码都是之前博文的，有介绍。
<style> .box1{list-style-type:none;width:200px;height:100px;overflow:hidden;position:relative;} .box1 li{width:200px;height:100px;position:absolute;top:0px;left:0px;} .box1 li.now{opacity:1;}/**1代表完全不透明**/ .box1 li.others{opacity:0;}/**1代表完全透明**/ </style> </head> <body> <div class="box1"> <ul class="list1"> <li id="img1" class="now"><img src="images/img1.png"></li> <li id="img2" class="others"><img src="images/img2.png"></li> <li id="img2" class="others" style="background:red"></li> </ul> </div> <input type="button" value="上一张" onclick="pre()"><br> <input type="button" value="下一张" onclick="next()"> <script> var index=0; var lis=document.getElementsByTagName("li"); var indexlength=lis.length-1;//长度-1是最后一个的索引 function pre(){ index--; if(index<0) { index=indexlength; } for(var i=0;i<lis.length;i++) { lis[i].className="others"; } lis[index].className="now"; }; function next(){ index++; if(index>indexlength) { index=0; } for(var i=0;i<lis.length;i++) { lis[i].className="others"; } lis[index].className="now"; }; var timer=setInterval(function(){next();var date=new Date();console.log("时间:"+(new Date()).toLocaleTimeString());},1000); </script>
图示 ：
共3张图片，循环播放这三个图，由于index索引是从0开始的，所以第0张就是第一张，第1张就是第2张，第2张就是第三张。
