计时器

计时器,我们通常都会用计时器来执行一些操作,比如间隔多少时间之后执行代码和延长多少时间之后来执行代码等等。那么,计时器又分为两种,一种叫间隔性触发计时器,另一种叫一次性计时器(延时计时器)。

间隔性触发计时器:setInterval() 每隔指定时间执行代码

             clearInterval()  取消setInterval的设置(可以理解为删除计时器)

一次性计时器 :setTimeout() 指定延迟的时间之后来执行一次代码

             clearTimeout()   取消setTimeout的设置

间隔性计时器和一次性计时器的差别就是间隔计时器时是指每隔指定的时间就触发一次,而一次性计时器则是延迟指定时间后只执行一次触发。

接下来使用两种计时器来实现数字累加。

在这里页面布局使用的是bootstrap4框架搭建。

在这里插入图片描述
在这里插入图片描述
完成布局之后开始书写js代码,首先先实现间隔性计时器的数字累加。
在这里插入图片描述

代码书写完成之后转到页面上查看效果。
在这里插入图片描述

当点击开始计时的时候,很显然数字以每间隔200毫秒就触发一次的速度进行累加。因为刚刚书写js的时候我们也书写了清除间隔计时器的代码,所以当点击停止计时的时候,数字将不再进行累加。

接下来将使用一次性计时器来实现数字累加。
在这里插入图片描述
转到页面查看效果
在这里插入图片描述

很明显,当点击开始计时的时候延时了200毫秒才进行数字累加(仅一次累加)。

顾名思义,一次性计时器只执行一次的触发(可延时),不同于间隔计时器的间接触发,这便是两个计时器的差别,这也方便了我们在不同场景针对计时器有了不同的选择。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值