搜索

查看: 3149|回复: 11

[CSS/HTML] HTML DOM setInterval和clearInterval方法案例详解

[复制链接]
发表于 2023-5-4 16:47:47 | 显示全部楼层 |阅读模式
Editor 2023-5-4 16:47:47 3149 11 看全部
在javascript编程中,setInterval可以帮助我们实现一个定时器的功能,能够让我们定时执行某一项操作,如果不需要继续执行了,我们只需要调用clearInterval函数,清除定时器即可。
这里要重点说的是清除定时器的时机,我们一般是需要进行一个条件判断,比如 var count=5,我们定时执行count--操作,当count==0的时候,清除定时器,一般情况下,我们的代码是这样写的。

202108281046378.png

HTML DOM setInterval和clearInterval方法案例详解9627 作者:Editor 帖子ID:2797 论坛知鸟论坛_zn60.com


这段代码,逻辑上没有什么问题, 就是当count==0的时候,我们清除定时器。我们运行这段代码,看看效果:

202108281046379.png

HTML DOM setInterval和clearInterval方法案例详解6228 作者:Editor 帖子ID:2797 论坛知鸟论坛_zn60.com


我们惊奇的发现,并不是我们想象中的那样,setInterval这个函数,并不会在清理定时器之后,就退出,后续的操作还是会执行。为了让清除定时器之后的代码不再执行,我们可以直接进行return返回。

2021082810463810.png

HTML DOM setInterval和clearInterval方法案例详解6535 作者:Editor 帖子ID:2797 论坛知鸟论坛_zn60.com


这种办法是可行的,但是也是没有太大的必要,我们可以进行简单的语句顺序调换,把条件判断放到最后,我们的代码就成了这样。

2021082810463811.png

HTML DOM setInterval和clearInterval方法案例详解1194 作者:Editor 帖子ID:2797 论坛知鸟论坛_zn60.com


同样,可以达到我们预期的效果:

2021082810463812.gif

HTML DOM setInterval和clearInterval方法案例详解6437 作者:Editor 帖子ID:2797 论坛知鸟论坛_zn60.com


setInterval函数执行,会返回一个定时参数,这里我们叫interval,当我们需要清除定时器的时候,就直接传入这个参数,如clearInterval(interval)。
到此这篇关于HTML DOM setInterval和clearInterval方法案例详解的文章就介绍到这了,更多相关HTML DOM setInterval和clearInterval方法内容请搜索知鸟论坛以前的文章或继续浏览下面的相关文章希望大家以后多多支持知鸟论坛!
发表于 2023-6-28 21:58:09 | 显示全部楼层
我的苦恼冉 2023-6-28 21:58:09 看全部
论坛不能没有像楼主这样的人才啊!我会一直支持知鸟论坛。
发表于 2023-6-29 00:18:28 | 显示全部楼层
当当当当裤裆坦 2023-6-29 00:18:28 看全部
楼主发贴辛苦了,谢谢楼主分享!我觉得知鸟论坛是注册对了!
发表于 2023-6-29 09:33:05 | 显示全部楼层
贺老师 2023-6-29 09:33:05 看全部
这东西我收了!谢谢楼主!知鸟论坛真好!
发表于 2023-6-29 22:04:36 | 显示全部楼层
戏做顿 2023-6-29 22:04:36 看全部
我看不错噢 谢谢楼主!知鸟论坛越来越好!
发表于 2023-6-29 23:12:25 | 显示全部楼层
风来时狂放 2023-6-29 23:12:25 看全部
楼主,大恩不言谢了!知鸟论坛是最棒的!
发表于 2023-6-30 00:47:15 | 显示全部楼层
我是的十八簿 2023-6-30 00:47:15 看全部
楼主太厉害了!楼主,I*老*虎*U!我觉得知鸟论坛真是个好地方!
发表于 2023-6-30 15:22:15 | 显示全部楼层
xinting_6ym 2023-6-30 15:22:15 看全部
楼主太厉害了!楼主,I*老*虎*U!我觉得知鸟论坛真是个好地方!
发表于 2023-6-30 15:31:01 | 显示全部楼层
永远就三年疗 2023-6-30 15:31:01 看全部
楼主发贴辛苦了,谢谢楼主分享!我觉得知鸟论坛是注册对了!
发表于 2023-6-30 18:18:57 | 显示全部楼层
ffycxyw2274436 2023-6-30 18:18:57 看全部
楼主,大恩不言谢了!知鸟论坛是最棒的!
  • 您可能感兴趣
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则 返回列表

RSS订阅| 小黑屋| 知鸟论坛 |网站地图
本站资源来自互联网用户收集发布,如有侵权请邮件联系处理。 联系邮箱E-mail:zniao@foxmail.com
快速回复 返回顶部 返回列表