<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>picture</title>
</head>
<body><div >
<img src="唐笑.jpg">
<!--<img src="杜德伟.jpg">;-->
<!--<img src="林俊杰.jpg">;-->
<!--<img src="萧亚轩.jpg">;-->
<div >
<td><input type="button" value="1" onclick="change('唐笑')"></td>
<td><input type="button" value="2"onclick="change('杜德伟')"></td>
<td><input type="button" value="3" onclick="change('林俊杰')"></td>
<td><input type="button" value="4" onclick="change('萧亚轩')"></td>
</div>
</div>
<script>
// <!--把图片和按钮先拿出来-->
var picture = document.getElementsByTagName("img");
var Button = document.getElementsByTagName("input");
// 定义图片更换的方法
function change(i) {
picture[0].src = i+".jpg"
}
// 现在需要循环执行change()函数，就是依次将四个参数传给change函数，首先将四个名字放入一个数组里
//遍历这个数组，得到参数，一次调用change（）函数就ok了。
var arrayObj = new Array("唐笑","杜德伟","林俊杰","萧亚轩");
function zhixing() {
for(i = 0;i<arrayObj.length;i++){
// alert(arrayObj[i]);
var pp = change(arrayObj[i]);
setTimeout(pp,1000)
}
}
setInterval(zhixing,1000)
</script>
</body></html>
js练习题之图片背景轮播
猜你喜欢
转载自www.cnblogs.com/chaojiyingxiong/p/9313839.html
今日推荐
周排行