博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JS中setTimeout()用法总结
阅读量:5036 次
发布时间:2019-06-12

本文共 1230 字,大约阅读时间需要 4 分钟。

         在制作网页动态效果时,一定会遇到某些需求,要求某段程序等待多时时间后再开始执行,就像在我们的生活中一样,待会儿再开始做一件事。在JavaScript中主要通过定时器实现此类需求,本文将对定时器做一个概括,正对setTimeout()做一个详细用法总结。

一.setInterval与setTimeout的区别

setInterval

setInterval()方法可按照指定的周期来调用函数或者计算表达式(以毫秒为单位)

语法:

setInterval(函数表达式,毫秒数);

setInterval()会不停的调用函数,直到clearInterval()被调用或者窗口被关闭,由 setInterval()返回的ID值可用作clearInterval()方法的参数。

 

setTimeout

setTimeout()方法用于在指定毫秒数后再调用函数或者计算表达式(以毫秒为单位)

语法:

setTimeout(函数表达式,毫秒数);

setTimeout()只执行函数一次,如果需要多次调用可以使用setInterval(),或者在函数体内再次调用setTimeout()

 

区别

  通过以上分析可以看出,setTimeout与setInterval的主要区别是:

  setTimeout()方法只运行一次,也就是说当达到设定的时间后就出发运行指定的代码,运行完后就结束了,如果还想再次执行同样的函数,可以在函数体内再次调用setTimeout(),可以达到循环调用的效果。

  setInterval()是循环执行的,即每达到指定的时间间隔就执行相应的函数或者表达式,是真正的定时器。

二.setTimeout()的用法

  先写个最简单的demo,如下:

  

1  2   3       4            
5 8 9 10 11

页面会在停留2秒之后弹出对话框,注意setTimeout不会自动重复执行!

当然,setTimeout也可以执行function,还可以不断重复执行!

你可以看到h1中的文本数字在一秒一秒地递增!

更加灵活的是,你还可以指定重复执行的次数,如下:

if判断中的数字,是用来限制重复执行次数的条件。

三.clearTimeout()

要使用clearTimeout(),需要我们设定setTimeout()时, 给予这setTimeout()一个名称, 这名称就是timeoutID ,我们叫停时,就是用这 timeoutID 来叫停

1   2    3        4             
5 9 10 11 12

原计划1秒后弹出的警示框,被自然叫停了。

 

转载于:https://www.cnblogs.com/lizuo2828/p/javascript.html

你可能感兴趣的文章
聊天室(C++客户端+Pyhton服务器)_1.框架搭设
查看>>
UpdatePanel 内控件 更新“外的”控件【转】
查看>>
mybatis中>=和<=的实现方式
查看>>
Python面向对象03/继承
查看>>
java序列化和反序列化
查看>>
绝对定位
查看>>
flink源码编译(windows环境)
查看>>
dpkg 删除 百度网盘 程序
查看>>
服务器nginx安装
查看>>
std::nothrow
查看>>
rest-framework 分页器
查看>>
JQuery(一)安装&选择器 样式篇
查看>>
浏览器的DNS缓存查看和清除
查看>>
浏览器跨域问题
查看>>
HTML5 input控件 placeholder属性
查看>>
使用JAVA如何对图片进行格式检查以及安全检查处理
查看>>
html5实现移动端下拉刷新(原理和代码)
查看>>
iPhone开发中从一个视图跳到另一个视图有三种方法:
查看>>
pytho logging
查看>>
一个Java程序员应该掌握的10项技能
查看>>