setInterval与setTimeout的区别
在制作网页动态效果时，一定会遇到某些需求，要求某段程序等待多时时间后再开始执行，就像在我们的生活中一样，待会儿再开始做一件事。在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 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8">
5 <script>
6 setTimeout("alert('hello')",2000);
7 </script>
8 </head>
9 <body>
10 </body>
11 </html>
页面会在停留2秒之后弹出对话框,注意setTimeout不会自动重复执行！
当然，setTimeout也可以执行function，还可以不断重复执行！
你可以看到h1中的文本数字在一秒一秒地递增！
更加灵活的是，你还可以指定重复执行的次数，如下：
if判断中的数字，是用来限制重复执行次数的条件。
三.clearTimeout()
要使用clearTimeout()，需要我们设定setTimeout()时， 给予这setTimeout()一个名称, 这名称就是timeoutID ，我们叫停时，就是用这 timeoutID 来叫停
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8">
5 <script>
6 var timeId= setTimeout("alert('hello')",2000);
7 clearTimeout(timeId);
8 </script>
9 </head>
10 <body>
11 </body>
12 </html>
原计划1秒后弹出的警示框，被自然叫停了。
setInterval与setTimeout的区别的更多相关文章
- 第46天：setInterval与setTimeout的区别
js的setTimeout方法用处比较多,通常用在页面刷新了.延迟执行了等等.今天对js的setTimeout方法做一个系统地总结. setInterval与setTimeout的区别 说道setTi ...
- val();html();.text()区别 setInterval与setTimeout的区别
val();html();.text()区别 对于innerHTML 属性,几乎所有的元素都有innerHTML属性,它是一个字符串,用来设置或获取位于对象起始和结束标签内的HTML.(获取HTM ...
- setInterval和setTimeout的区别以及setInterval越来越快问题的解决方法
setInterval()和setTimeout()方法都是js原生的定时方法,当然它们两个的作用也是不同的,并且最近在做上下滚动公告栏的时候,发现了setInterval()非常令人抓狂的问题,那就 ...
- JS中setInterval与setTimeout的区别
JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function& ...
- 【JavaScript】setinterval和setTimeout的区别
计时器setTimeout()与setInterval()是原生JS很重要且用处很多的两个方法, 但很多人一直误以为是相同的功能: 间隔时间重复执行传入的句柄函数. 但实际上, 并非如此, 既然JS给 ...
- setInterval和setTimeout的区别
setInterval会每隔指定的毫秒数后反复执行指定代码. setTimeout只会在指定的毫秒数后执行一次指定代码. setInterval的用法: // 创建(创建后即开始计时) var int ...
- setInterval()和setTimeout()的区别
一.setInterval()函数的语法结构: setInterval(code,interval) setInterval()函数可周期性执行一段代码,也就是说代码会被周期性不断的执行下去. 函数具 ...
- setInterval()与setTimeout()的区别
setInterval()-一旦被开启就会不断的执行,使用clearInterval()清除后将不再执行 setTimeout()-又称为一次定时器,定时器开启后只执行一次将不会接着执行,使用clea ...
- setInterval与setTimeout 的区别
setInterval在执行完一次代码之后,经过了那个固定的时间间隔,它还会自动重复执行代码,而setTimeout只执行一次那段代码 用法: setInterval("alert( ...
随机推荐
- sqlserver插入之字符串+数字
declare @i int,@a varchar(10)set @i = 0set @a='hiro--'+LTRIM(@i)while @i < 500begin insert into h ...
- c# 判断当前时间是否在某一时间段内
//获取当前系统时间并判断是否为服务时间 TimeSpan nowDt = DateTime.Now.TimeOfDay; TimeSpan workStartDT = DateTime.Parse( ...
- AVL树的实现——c++
一.概念 AVL树是根据它的发明者G.M. Adelson-Velsky和E.M. Landis命名的.它是最先发明的自平衡二叉查找树,也被称为高度平衡树.相比于"二叉查找树",它 ...
- ESP8266 wifi干扰、钓鱼实现
说明:绝大部分都是对着下面的参考文章来做的.这里只把基本流程和我自己遇到的问题写一下.如有其他问题可以访问文章末的参考文章进行查找! esp8266模块 我们需要购买一块esp8266模块,如下图所示 ...
- ACTIVEMQ监控项目admin队列详情中文乱码
一.使用ACTIVEMQ队列,传入ObjectMessage时,监控项目admin无法解析消息信息,需要将消息javabean打成jar放入lib文件夹中,重启ACTIVEMQ,注意javabean要 ...
- 解决Windows 8.1 应用商店中安装程序挂起的解决
阅读目录: 在Windows 8.1系统的应用程序商店中安装程序时,总是提醒“挂起”状态.无法进行后续安装,看了下国内不少用户有这个困扰,特此总结自己的解决方案. 1. 确保Windows updat ...
- springmvc执行流程详细介绍
1.什么是MVC MVC是Model View Controller的缩写,它是一个设计模式 2.springmvc执行流程详细介绍 第一步:发起请求到前端控制器(DispatcherServlet) ...
- JavaScript里的Date 对象属性及对象方法－－实现简单的日历
上网搜索"js 日历插件"就会出来各种效果的功能丰富的日历插件,很多都可以下载源码,然后根据各自的需求对源码进行修改就可以直接用了. 但今天讲的不是如何使用这些插件,而是讲如何实现 ...
- Pycharm使用Git
Pycharm使用Git 1.设置git程序路径 2.设置github连接 3.创建git respository 4.提交文件 5.共享给GitHub 6.修改文件push到版本库 7.从版本库ch ...
- C++基础知识 基类指针、虚函数、多态性、纯虚函数、虚析构
一.基类指针.派生类指针 父类指针可以new一个子类对象 二.虚函数 有没有一个解决方法,使我们只定义一个对象指针,就可以调用父类,以及各个子类的同名函数? 有解决方案,这个对象指针必须是一个父类类型 ...