定时器 — 换背景图片

点击换背景按钮，页面背景自动更换；点击停按钮，图片停止更换；

html：

<input type="button" value="点我换个背景吧">
<input type="button" value="停！">

js：

var body = document.body;//获取页面
var btn = document.getElementsByTagName('input');//获取按钮
var arrUrl = ['img/13.jpg','img/14.jpg','img/15.jpg','img/16.jpg'];//图片数组
var num = 0;//一般有数组的地方都是有数字的,有数字就可以操作数组
var timer = null;//要设置定时器首先得有开关

// 给按钮添加点击事件
btn[0].onclick = function(){    
    clearInterval(timer);//在每次使用定时器前先清除一下定时器
    timer = setInterval(function(){
        body.style.background = 'url('+arrUrl[num]+')';//url后面的内容是根据数组来定的所以拼接
        num++;
        num %= arrUrl.length;//num 除以数组的长度，这样每次就只有数组中的图片来回切换 
    },2000);//二秒钟之后执行该函数
};
// 点击停按钮，清除定时器
btn[1].onclick = function(){
    clearInterval(timer);
};

注意：
1、定时器如果是由用户控制（事件控制），一定要遵循一个原则：先关后开;
2、在开定时器前一定要先清除定时器clearInterval(timer);；
3、如果不先清除定时器会出现频闪现象，而且也停不下来，因为一个定时器还有没有完毕，又继续开启定时器会造成快速换图片；