setTimeout(methodName, interval); //间隔时间单位为毫秒，表示interval毫秒后执行方法methodName

setInterval(methodName, interval); //间隔时间单位为毫秒，表示每隔interval毫秒执行后都会执行一次方法methodName

执行的方法可以带参数，但是参数只能是字符串、数字类的，不能是对象

实例代码：

 <html>

     <head>

         <title>标题</title>

         <meta charset="utf8"/>

         <script type="text/javascript">

             //测试setTimeout

             var runTimeout, runInteval;

             function TestTimeout(idName){

                 if (!idName) idName = "showInfo";

                 document.getElementById(idName).innerText = (new Date()) + ", runTimeout = " + runTimeout;

                 runTimeout = setTimeout("TestTimeout('showInfo')", 1000); //一秒后执行

                 //或者写作：runTimeout = setTimeout(TestTimeout, 1000); //一秒后执行

             }

             function TestClearTimeout(){

                 clearTimeout(runTimeout);

                 runTimeout = null;

                 document.getElementById("showInfo").innerText = "setTimeout()停止了,  runTimeout = " + runTimeout;

             }

             //测试setInterval

             function ChangeTime(idName){

                 document.getElementById(idName).innerText = (new Date()) + ", runInteval = " + runInteval + ", runTimeout = " + runTimeout;

             }

             function TestInterval(){

                 if (runInteval){

                     return;

                 }

                 runInteval = setInterval("ChangeTime('showInfo2')", 1000); //每过一秒就调用ChangeTime()方法

                 //或者写作：runInteval = setInterval(ChangeTime, 1000);//需要带参数的话就用上面那种写法

             }

             //停止setInterval

             function TestClearInterval(){

                 clearInterval(runInteval);

                 runInteval = null;

                 document.getElementById("showInfo2").innerText = "setInterval()停止了,  runInteval = " + runInteval;

             }

         </script>

     </head>

     <body>

         <h3 id="showInfo"></h3>

         <h3 id="showInfo2"></h3>

         <input type="button" value="测试timeout" onclick="TestTimeout()"/>

         <input type="button" value="停止timeout" onclick="TestClearTimeout()"/>

         <input type="button" value="测试interval" onclick="TestInterval()"/>

         <input type="button" value="停止interval" onclick="TestClearInterval()" />

     </body>

 </html>

setTimeout和setInterval的更多相关文章

  1. 深入理解定时器系列第一篇——理解setTimeout和setInterval

    × 目录 [1]setTimeout [2]setInterval [3]运行机制[4]作用[5]应用 前面的话 很长时间以来,定时器一直是javascript动画的核心技术.但是,关于定时器,人们通 ...

  2. 前端开发：setTimeout与setInterval 定时器与异步循环数组

    前端开发:setTimeout与setInterval 定时器与异步循环数组 前言: 开通博客园三个月以来,随笔记录了工作中遇到的大大小小的难题,也看过无数篇令人启发的文章,我觉得这样的环境是极好的, ...

  3. setTimeout和setInterval从入门到精通

    我们在日常web前端开发中,经常需要用到定时器方法. 前端中的定时器方法是浏览器提供的,并不是ECMAScript规范中的.是window对象的方法. 浏览器中的定时器有两种, 一种是每间隔一定时间执 ...

  4. setTimeout和setInterval定时器使用详解测试

    var len=4; while(len--){ var time=setTimeout(function(){ console.log(len); },0); console.log(time); ...

  5. setTimeout，setInterval原理

    function a() { setTimeout(function(){alert(1)},0); alert(2); } a(); 和其他的编程语言一样,Javascript中的函数调用也是通过堆 ...

  6. Javascript的setTimeOut()和setInterval()的定时器用法

    Javascript用来处理延时和定时任务的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请 ...

  7. setTimeout和setInterval的注意事项

    精准问题 setTimeout的问题在于它并不是精准的,例如使用setTimeout设定一个任务在10ms后执行,但是在9ms后,有一个任务占用了5ms的cpu时间片,再次轮到定时器执行时,时间已经过 ...

  8. setTimeout和setInterval的区别以及如何写出效率高的倒计时

    1.setTimeout和setInterval都属于js中的定时器,可以规定延迟时间再执行某个操作,不同的是setTimeout在规定时间后执行完某个操作就停止了,而setInterval则可以一直 ...

  9. setTimeout()与setInterval()

    一.setTimeout与setInterval的用法(http://www.css88.com/archives/5804) setTimeout是超时调用,javascript是一个单线程的解析器 ...

  10. setTimeout 和 setInterval

    设置定时器,在一段时间之后执行指定的代码,setTimeout与setInterval的区别在于setTimeout函数指定的代码仅执行一次 方法一: window.setTimeout(" ...

随机推荐

  1. Hyperledger中数据存取的实现

    简介 本文介绍了在Hyperledger中数据存取的实现. API接口 Hyperledger提供基于key/value的数据存储,其中key是字符串,value则是二进制字节数组,Hyperledg ...

  2. HTML5的五种客户端离线存储方案

    最近折腾HTML5游戏需要离线存储功能,便把目前可用的几种HTML5存储方式研究了下,基于HT for Web写了个综合的实例,分别利用了Cookie.WebStorage.IndexedDB以及Fi ...

  3. 实现UniqueAttribute唯一性约束-优化版

    我之前就写过一篇<实现UniqueAttribute唯一性约束>,虽然实现了通过调用IsValid方法可以进行唯一性验证,但有一个缺点,那就是耦合度过高,原因是里面的DB上下文对象是直接写 ...

  4. 【Swift学习】Swift编程之旅---可选链（二十一）

    可选链Optional Chaining是一种可以在当前值可能为nil的可选值上请求和调用属性.方法及下标的方法.如果可选值有值,那么调用就会成功:如果可选值是nil,那么调用将返回nil.多个调用可 ...

  5. C#--静态函数成员

  6. 使用VS Code开发ASP.NET Core 应用程序

    最新教程:http://www.cnblogs.com/linezero/p/VSCodeASPNETCore.html 使用VS Code开发ASP.NET Core 应用程序 准备 1.安装VS ...

  7. Windows 7专业版安装VS2005与WinCE6.0开发环境

    近期更新了自己的小黑从XP更新到WIN7专业版,我花了两天时间验证了下列软件安装在WIN7 PRO是完全兼容的. 1:2011年最新更新的SourceInsight3.50.0066版本,这个是支持W ...

  8. C语言的字符串分割

    说起来很有意思,自认为对C语言理解得还是比较深刻的.但居然到今天才知道有个strtok函数,试用了一下突然感慨以前做了多少重复劳动.每次需要解析配置文件,每次需要分割字符串,居然都是自己去分割字符串, ...

  9. 组件Newtonsoft.Json实现object2json转换

    很多情况下,我们需要把数据类型做一些转换,供其它外部的子系统调用. 最为典型的是生成json格式供javascript作调用. 现成的组件Newtonsoft.Json可以实现object2json之 ...

  10. html5学习笔记4--API Range对象(一)

    Range对象基本用法 效果图如下(在谷歌浏览器下的展示)