计时器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. centos中mysql的安装

    一:前沿 过完年了,花了不少钱啊!本来还打算买电脑的了,结果这个事情还是的延期啊!苍天啊!刚刚也看了下,一台苹果也大概是1w左右!买吧!boy!别犹豫了吧!好吧现在来说说我自己的工作吧!现在过完年到公 ...

  2. 局部性原理的点滴应用场景 use of localityprinciple

    话说九月份博士入学面试的时候被问到了一个问题:请说明一下局部性原理在计算机科学中的应用场景?(哈哈,不记得怎么问的了,大概是这个意思)但是巴拉巴拉整半天却也只说出了一个Cache,后来补充的也都是跟C ...

  3. 【poj2114】点分治(离线)

    boatherds 2s 64M by czy 求一颗树上距离为K的点对是否存在 输入数据 n,m 接下来n-1条边a,b,c描述a到b有一条长度为c的路径 接下来m行每行询问一个K 输出数据 对于每 ...

  4. 【HDU】5269 ZYB loves Xor I

    [算法]trie [题解] 为了让数据有序,求lowbit无法直接排序,从而考虑倒过来排序,然后数据就会呈现出明显的规律: 法一:将数字倒着贴在字典树上,则容易发现两数的lowbit就是它们岔道结点的 ...

  5. php trait 变量类型为数组时 不能被父类子类同时use

    直接上代码 --------------------------- trait T1 { public static $a=1; public static $b= []; public static ...

  6. Atlantis(POJ1151+线段树+扫描线)

    题目链接:http://poj.org/problem?id=1151 题目: 题意:求所有矩形的面积,重合部分只算一次. 思路:扫描线入门题,推荐几篇学扫描线的博客: 1.http://www.cn ...

  7. bzoj 1968 数学

    在1-n所有数中,i一共可以成为n/i个数的约数,也即所有的约数中有n/i个i,所以扫一遍累加答案就好了. /********************************************* ...

  8. 网页实现插入图片—css与html的区别

    Q1.二者有何区别?A1.写在css里面的图片是以背景图形式存在的,而写在html里的是以<img>标签形式存在的,在网页加载的过程中,以css背景图存在的图片会等到结构加载完成(网页的内 ...

  9. python windows下安装celery调度任务时出错

    由于celery 4.0不支持windows系统.所以用命令pip install Celery安装的celery是最新版4.0的不能在windows下运行. 在windows命令窗口运行: cele ...

  10. 【POJ3254】coinfield

    状压dp初步. #include<iostream> #include<cstdio> #include<cstring> #include<algorith ...