实现轮播图
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.jpgimgObj.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>
实现轮播图
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.jpgimgObj.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>