<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{margin: 0;padding: 0}
body{background: #dddddd}
#div1{
width: 100%;
height: 100%;
}
</style>
</head>
<body id="div1" onload="showBgImage()">
</body>
</html>
<script>
function showBgImage() {
var curIndex = 0; //定义开始索引
var timeInterval = 1000;
//定义切换时间, 1s=1000ms
//定义存放图片数组
var arr = new Array();
arr[0] = "images/240.png"; //给数组每一项赋值,就是添加图片路劲
arr[1] = "images/340.png";
arr[2] = "images/240.png";
arr[3] = "images/340.png";
arr[4] = "images/240.png";
arr[5] = "images/340.png";
setInterval(changeImg, timeInterval); //调用显示图片方法(参数为:方法名和切换时间)
function changeImg() {
var obj = document.getElementById("div1"); //获得所要设置的元素
if (curIndex == arr.length - 1) {
curIndex = 0;
} else {
curIndex += 1;
}
obj.style.backgroundImage = "url(" + arr[curIndex] + ")"; //设置获得元素的背景图片
}
}
</script>