计时器setTimeout()与setInterval()是原生JS很重要且用处很多的两个方法, 但很多人一直误以为是相同的功能: 间隔时间重复执行传入的句柄函数. 但实际上, 并非如此, 既然JS给出了两个不同的命名, 肯定有其迥异之处.
先来看看两者JS手册及英文词典上的解释:
JS手册»setTimeout() : 用于在指定的毫秒数后调用函数或计算表达式;
英文释义»timeout() : 超时;暂时休息;工间休息;
JS手册»setInterval() : 按照指定的周期(以毫秒计)来调用函数或计算表达式. 会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭;
英文释义»interval() : 间隔;间距;幕间休息;
不难看出, 只要我们仔细体会JS手册及命名释义, 就能很容易的区分开两者的区别. 简单的说, 两才的区别在于,setTimeout()方法是在等待指定时间后执行函数, 且只执行一次传入的句柄函数. setInterval()方法是每指定间隔时间后执行一次传入的句柄函数,循环执行直至关闭窗口或clearInterval().

下面通过代码看一下却别:

 var timeout=function(){
alert('等待2s后弹出,仅此一次!在等待时间内clearTimeout可停止执行!')
}
var interval=function(){
alert('每2s循环弹出,直至clearInterval或关闭窗口!')
}
var input=document.getElementsByTagName('input'); var clearTimeoutFun=null;
var clearIntervalFun=null; input[].onclick=function(){
clearTimeoutFun=setTimeout(timeout,);
}
input[].onclick=function(){
clearTimeout(clearTimeoutFun);
}
input[].onclick=function(){
clearIntervalFun=setInterval(interval,);
}
input[].onclick=function(){
clearInterval(clearIntervalFun);
}

动手才是真理,自己可以动手写一下。

转载自 <a href="http://mrthink.net/js-settimeout-setinterval/" title="JS计时器setTimeout()与setInterval()方法的区别" rel="bookmark">JS计时器setTimeout()与setInterval()方法的区别@Mr.Think</a>

【JavaScript】setinterval和setTimeout的区别的更多相关文章

  1. setInterval与setTimeout的区别

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

  2. 第46天:setInterval与setTimeout的区别

    js的setTimeout方法用处比较多,通常用在页面刷新了.延迟执行了等等.今天对js的setTimeout方法做一个系统地总结. setInterval与setTimeout的区别 说道setTi ...

  3. val();html();.text()区别 setInterval与setTimeout的区别

    val();html();.text()区别   对于innerHTML 属性,几乎所有的元素都有innerHTML属性,它是一个字符串,用来设置或获取位于对象起始和结束标签内的HTML.(获取HTM ...

  4. setInterval和setTimeout的区别以及setInterval越来越快问题的解决方法

    setInterval()和setTimeout()方法都是js原生的定时方法,当然它们两个的作用也是不同的,并且最近在做上下滚动公告栏的时候,发现了setInterval()非常令人抓狂的问题,那就 ...

  5. JavaScript SetInterval与setTimeout使用方法详解

    setTimeout和setInterval的语法相同.它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码.不过这两个函数还是有区别的 ...

  6. JavaScript setInterval 与 setTimeout 区别

    setInterval:一直循环调用函数,不会停止:需要用 clearInterval 去停止 setTimeout:只调用一次

  7. JS中setInterval与setTimeout的区别

    JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function& ...

  8. setInterval()和setTimeout()的区别

    一.setInterval()函数的语法结构: setInterval(code,interval) setInterval()函数可周期性执行一段代码,也就是说代码会被周期性不断的执行下去. 函数具 ...

  9. setInterval和setTimeout的区别

    setInterval会每隔指定的毫秒数后反复执行指定代码. setTimeout只会在指定的毫秒数后执行一次指定代码. setInterval的用法: // 创建(创建后即开始计时) var int ...

随机推荐

  1. [Android问答] px、dp和sp,这些单位有什么区别?

    相信每个Android新手都会遇到这个问题,希望这篇帖子能让你不再纠结. px: 即像素,1px代表屏幕上一个物理的像素点: px单位不被建议使用,因为同样100px的图片,在不同手机上显示的实际大小 ...

  2. Java设计模式の工厂模式

    -------------------------------------------------------- 目录:  一.序言 二.简单工厂模式 三.工厂方法模式 四.简单工厂和工厂方法模式的比 ...

  3. 小米路由器设置DMZ主机 并在外网访问

    一.前提条件: 1.小米路由器 2.拥有公网IP的网络 二.步骤: 1.登陆小米路由器管理界面  miwifi.com 2.高级设置=>端口转发  页面底部的DMZ选项开启,然后选择需要映射到外 ...

  4. 【c#】winform 上传图片

    1.拖拽上传图片 1.1.后台代码中修改窗体属性,添加 AllowDrop = true 1.2.给窗体添加拖拽事件,在事件列表找到拖拽 双击即可: 在 DragDrop 生成的方法中添加代码如下: ...

  5. 杭电多校第八场-A-Character Encoding

    题目描述 In computer science, a character is a letter, a digit, a punctuation mark or some other similar ...

  6. Codeforces Round #380 (Div. 2)/729E Subordinates 贪心

    There are n workers in a company, each of them has a unique id from 1 to n. Exaclty one of them is a ...

  7. CSS浮动为什么不会遮盖同级元素

    1.问题描述 在W3CSchool学习web前端时,看完CSS定位-浮动这一节后,感觉没有什么问题.但是在CSS高级-分类这一节的中进行实践时,遇到了如下问题.测试地址:浮动的简单应用. 完整的htm ...

  8. 在ubuntu16.04+python3.5情况下安装nltk,以及gensim时pip3安装不成功的解决办法

    在ubuntu16.04+python3.5情况下安装nltk,以及gensim时pip3安装不成功的解决办法,我刚开始因为不太会用linux命令,所以一直依赖于python 的pip命令,可是怎么都 ...

  9. python调参神器hyperopt

    一.安装 pip install hyperopt 二.说明 Hyperopt提供了一个优化接口,这个接口接受一个评估函数和参数空间,能计算出参数空间内的一个点的损失函数值.用户还要指定空间内参数的分 ...

  10. LCD实验学习笔记(十):TFT LCD

    硬件组成: REGBANK是LCD控制寄存器组,含17个寄存器及一块256*16的调色板,用来设置参数. LCDCDMA中有两个FIFO,当FIFO空或数据减少到阈值,自动发起DMA传输,从内存获取图 ...