定时器 消除定时器故障_定时器的设置方法

定时器 消除定时器故障_定时器的设置方法使用setTimeout可以使事件执行延迟setTimeout(延迟执行的函数,延迟的毫秒数)其中可以写成这种直接写函数的形式window.setTimeout(function(){alert(‘两秒到啦’);},2

定时器:

定时器有两种,setTimeout () setInterval (),二者的区别在于时间到后执行回调函数的次数,setTimeout () 只能执行一次,而 setInterval () 每当间隔这个倒计时一次,就会执行一次回调函数内容


setTimeout ()

  • 时间结束后执行回调函数
  • 只执行一次

setInterval ()

  • 时间结束后执行回调函数
  • 每间隔一次倒计时就会执行一次

 在开始说明定时器前我们先引入一个概念 —— 回调函数,顾名思义,回调就是回头再调用,在定时器部分,我们在倒计时结束后执行的函数,就叫做回调函数,我们在注册事件时内部的函数也是回调函数


一:setTimeout ( 回调函数,延迟的毫秒数 )

其中可以写成这种直接写函数的形式

 window.setTimeout(function(){
          alert('两秒到啦');
      },2000)

也可以写成这种写函数名的形式(不用加括号!!)

 window.setTimeout(fn,2000)
    
    function fn(){
        alert('两秒到啦');
    }

效果均是延迟两秒后弹出,要注意延迟的时间要写成毫秒数!!


二:setInterval ( 回调函数,延迟的毫秒数 )

记住这个定时器的回调函数时间每过一次就会执行一次,两种函数写法与 setTimeout 相同

<script>
        window.setInterval(function(){
           alert('时间到啦');
        },4000)
    </script>

注意点:

  • window 可以省略
  • 可以采用直接写函数或写函数名
  • 时间一定要写成毫秒数
  • 页面中可能有很多定时器,最好设置标志符号,var time1= window.setTimeout(fn,2000)

消除定时器:

消除定时器有 clearTimeout ()clearInterval ()


clearTimeout ( 要删除的定时器 ):

 <button>关闭</button>
    <script>
        var btn=document.querySelector('button');
        var time1=window.setTimeout(function(){
           alert('倒计时到啦');
        },3000)
        btn.addEventListener('click',function(){
            window.clearTimeout(time1);
        })
    </script>

clearInterval (要删除的定时器):

此方法可以使反复在执行并且调用的计时器中断

<button>关闭</button>
    <script>
        var btn=document.querySelector('button');
        var time1=window.setInterval(function(){
           console.log('倒计时到啦');
        },1000)
        btn.addEventListener('click',function(){
            window.clearInterval(time1);
        })
    </script>

今天的文章定时器 消除定时器故障_定时器的设置方法分享到此就结束了,感谢您的阅读。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/75696.html

(0)
编程小号编程小号

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注