码迷,mamicode.com
首页 > Web开发 > 详细

js 定时器用法详解——setTimeout()、setInterval()、clearTimeout()、clearInterval()

时间:2017-05-23 11:22:31      阅读:219      评论:0      收藏:0      [点我收藏+]

标签:nbsp   exp   asc   详解   string   settime   doc   user   表达式   

  

 

在js应用中,定时器的作用就是可以设定当到达一个时间来执行一个函数,或者每隔几秒重复执行某段函数。这里面涉及到了三个函数方法:setInterval()、setTimeout()、clearInterval(),本文将围绕这三种函数的用法,来实现定时器的功能,需要的朋友可以过来参考下,喜欢的可以点波赞,或者关注一下本人,希望对大家有所帮助。

定时器的应用需求:

1.设定一个时间,当时间到达的时候执行函数————比如:倒计时跳转页面等等。

2.每隔一段时间重复执行某段函数————比如抢票软件,比如设定500毫秒就重复刷新一次页面等等。

js定时器:

菜鸟教程中是这么说的——js 定时器有以下两个方法:

setTimeout() :在指定的毫秒数后调用函数或计算表达式。

setInterval() :按照指定的周期(以毫秒计)来调用函数或计算表达式。方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。

使用语法:

setTimeout():setTimeout(code,millisec)

setInterval():setInterval(code,millisec[,"lang"])

参数:code————要进行调用的函数或者要执行的代码串。millisec————时间(默认毫秒来计算),lang————可选。 JScript | VBScript | JavaScript()

然而setTimeout()、setInterval()的区别在于

setTimeout():当方法执行完成定时器就立即停止(但是定时器还在,只不过没用了);

setInterval():当方法执行完成,定时器并没有停止,以后每隔[interval]这么长的时间都会重新的执行对应的方法[function],直到我们手动清除定时器为止;

意思就是:

setTimeout()时间到了只会执行一次,setInterval()不会停止,会不间断的执行对应的函数,直到我们手动暂停或窗口被关闭。

倒计时跳转demo讲解:

 
    <div class="time">请等待<span id="dd">5</span>秒</div>
//js部分:
function run(){
            var s = document.getElementById("dd");
            if(s.innerHTML == 0){
                window.location.href = "https://juejin.im/user/58714f0eb123db4a2eb95372/article";
                clearInterval(run());
            }
            s.innerHTML = s.innerHTML -1;
        }
        window.setInterval("run();", 1000);
     

js 定时器用法详解——setTimeout()、setInterval()、clearTimeout()、clearInterval()

标签:nbsp   exp   asc   详解   string   settime   doc   user   表达式   

原文地址:http://www.cnblogs.com/deng-haiwei/p/6892968.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!