重复执行定时器:setInterval
作用:
每隔一段时间就会去重复执行相应的代码。
语法:
1 setInterval(函数,时间);
参数:
1、函数:当时间到达后会执行这个函数。
2、时间:重复执行的时间 。
栗子:
1 setInterval(function(){ 2 alert(1);//直接写要执行的代码 3 },5000); 4 setInterval(function(){ 5 fn();//可以把要做的事情封装到一个函数里,然后直接调用该函数。 6 },5000); 7 setInterval(fn,5000);//也可以直接把函数名作为第一个参数 8 9 function fn(){ 10 alert(1); 11 }
当需要隔一段时间重复执行一段代码时用setInterval()。
延迟执行定时器:setTimeout
作用:
当时间到达后,去执行相应的代码。只执行一次。
语法:
1 setTimeout(函数,时间);
参数:
1、函数:当时间到达后会执行这个函数。
2、时间:等多久执行代码。
栗子:
1 setTimeout(function(){ 2 alert(1);//直接写要执行的代码 3 },1000); 4 setTimeout(function(){ 5 fn1();//可以把要做的事情封装到一个函数里,然后直接调用该函数。 6 },1000); 7 setTimeout(fn1,1000);//也可以直接把函数名作为第一个参数 8 9 function fn1(){ 10 alert(1); 11 }
清除定时器
定时器都会有一个返回值,返回一个数字。这个数字就代表对应的定时器。
1 console.log(setTimeout(function(){},100));//1 2 console.log(setInterval(function(){},100));//2
直接用定时器的编号是没办法全部清除定时器的,可以声明一个变量,把定时器的返回值存到这个变量当中,用变量代表它,就可以清除掉对应的定时器。把定时器赋值给一个变量后,这个定时器也同样会自动执行,定时器的执行与变量没有关系。
1 var timer=setTimeout(function(){},100);
清除重复执行定时器:
1 clearInterval(定时器的返回值);
清除延迟执行定时器:
1 clearTimeout(定时器的返回值);
清除定时器的时候,当次的定时器依然会执行完毕,当这次执行完后,才清除掉这个定时器。
定时器里的this
定时器里的this是指向window的。
1 var btn=document.getElementById("btn"); 2 btn.onclick=function(){ 3 console.log(this);//btn 4 setTimeout(function(){ 5 console.log(this);//window 6 },500); 7 };