1、轮播图的函数
<script> function init(){ setInterval("changeImg()",3000); } var i=0 function changeImg(){ i++; document.getElementById("img").src="../img/"+i+".jpg"; if(i==3){ i=0; } } </script>
其中：setInterval("changeImg()",3000);的作用是3000ms执行一次 changeImg()函数，在 changeImg()函数中， document.getElementById("img").src="../img/"+i+".jpg"; 是在给img属性赋值（图片的路径）。
<body onload="init()"> <div id=""> <img src="../img/1.jpg" width="100%" id="img"/> </div> </body>
2、完整轮播图代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>首页</title>
<style>
@import url("/css/lunbo.css");
</style>
<script>
function init(){
setInterval("changeImg()",3000);
}
var i=0
function changeImg(){
i++;
document.getElementById("img").src="../img/"+i+".jpg";
if(i==3){
i=0;
}
}
</script>
</head>
<body onload="init()">
<div id="">
<img src="../img/1.jpg" width="100%" id="img"/>
</div>
</body>
</html>
3、项目结构
4、轮播图效果
三张图片每隔三秒切换一次