定时器
间隔定时器
永动机(隔一段时间,函数执行一次,如果你不手动清除,永远不会停止)
setInterval(function(){},inter); 以毫秒为单位
function fn(){
}
setInterval(fn,inter); 以毫秒为单位
eg:
setInterval(function(){
//code
},1000);
含义:间隔一秒调用一次函数
返回值:
定时器的 ID 定时器编号
定时器 需要管理 (某个定时器 进行开启,清除,开启....)
clearInterval(定时器的id);
var timer = null;
timer = setInterval(function(){
},1000);
var timer2 = null;
timer2 = setInterval(function(){},1000);
console.log(timer); //1
console.log(timer2); //2
var timer = null;
timer = setInterval(fn,interval);
清除:
clearInterval(timer);
同一个id定时器,如果多次开启,会以队列的形式,运行(会同时出现多个定时器),在清除的时候,只能清除一个,
在开启定时器之前先清空,保证队列中永远只有一个定时器
<body>
<button>开始换</button>
<button>停止</button>
<script>
var body = document.getElementsByTagName("body")[0];
var btns = document.querySelectorAll('button');
var timer = null;
var index =0;
btns[0].onclick=function(){
clearInterval(timer);
timer = setInterval(function(){
index++;
//限制最大值
// if( index == 20 ){
// index = 0;
// }
index%=20;
body.style.background="url(imgs/"+ index +".jpg)";
},500)
}
btns[1].onclick = function(){
clearInterval(timer);
}
倒计时定时器 定时炸弹 (有一个倒计时,时间到了,函数执行一次结束)
setTimeout(fn,interval);
如果需要管理的话
清除:
clearTimeout(timer)