html: 相当于机器人的框架; css: 给机器人涂色， 穿个衣服; js: 让机器人可以动起来.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
// 1. 定义一个变量， 控制图片的循环顺序;
var i = 1;
function changeImg() {
// # 获取图片对象;
var imgObj = document.getElementById('img');
// 2. 当点击下一页的时候， i+1, 图片变成img2.jpg;
i += 1;
// 事先建立需要轮播的图库img1...
//3. 修改图片对象里面的src属性;img/img2.jpg
imgObj.src = 'img/img' + i + '.jpg';
//4. 如果轮播图片结束， 从头开始轮播;
if (i===6){
i = 0;
}
}
</script>
</head>
<body "setInterval('changeImg()', 1000);">
<div>
<!--
思路:
1). 确定事件的类型onload事件;
2). 并给对应的事件绑定函数changeImg();
-->
<img id='img' src="img/img1.jpg"><br/>
<!--<input type="button" onclick="changeImg()" value="下一页">-->
</div>
</body>
</html>