定时器

重复执行定时器: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 };
原文地址:https://www.cnblogs.com/imguo/p/5765646.html