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

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

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

实例代码：

  1.  <html>
  2.      <head>
  3.          <title>标题</title>
  4.          <meta charset="utf8"/>
  5.          <script type="text/javascript">
  6.              //测试setTimeout
  7.              var runTimeout, runInteval;
  8.              function TestTimeout(idName){
  9.                  if (!idName) idName = "showInfo";
  10.  
  11.                  document.getElementById(idName).innerText = (new Date()) + ", runTimeout = " + runTimeout;
  12.                  runTimeout = setTimeout("TestTimeout('showInfo')", 1000); //一秒后执行
  13.                  //或者写作：runTimeout = setTimeout(TestTimeout, 1000); //一秒后执行
  14.              }
  15.  
  16.              function TestClearTimeout(){
  17.                  clearTimeout(runTimeout);
  18.                  runTimeout = null;
  19.                  document.getElementById("showInfo").innerText = "setTimeout()停止了,  runTimeout = " + runTimeout;
  20.              }
  21.  
  22.              //测试setInterval
  23.              function ChangeTime(idName){
  24.                  document.getElementById(idName).innerText = (new Date()) + ", runInteval = " + runInteval + ", runTimeout = " + runTimeout;
  25.              }
  26.  
  27.              function TestInterval(){
  28.                  if (runInteval){
  29.                      return;
  30.                  }
  31.                  runInteval = setInterval("ChangeTime('showInfo2')", 1000); //每过一秒就调用ChangeTime()方法
  32.                  //或者写作：runInteval = setInterval(ChangeTime, 1000);//需要带参数的话就用上面那种写法
  33.              }
  34.              //停止setInterval
  35.              function TestClearInterval(){
  36.                  clearInterval(runInteval);
  37.                  runInteval = null;
  38.                  document.getElementById("showInfo2").innerText = "setInterval()停止了,  runInteval = " + runInteval;
  39.              }
  40.  
  41.          </script>
  42.      </head>
  43.      <body>
  44.          <h3 id="showInfo"></h3>
  45.          <h3 id="showInfo2"></h3>
  46.          <input type="button" value="测试timeout" onclick="TestTimeout()"/>
  47.          <input type="button" value="停止timeout" onclick="TestClearTimeout()"/>
  48.          <input type="button" value="测试interval" onclick="TestInterval()"/>
  49.          <input type="button" value="停止interval" onclick="TestClearInterval()" />
  50.      </body>
  51.  </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. solr的suggest模块

    solr的suggest模块 solr有个suggest模块,用来实现下拉提醒功能,就是输入了一个文本之后,进行文本建议查找的功能. suggest请求的url http://localhost:89 ...

  2. [AngularJS] AngularJS系列(2) 中级篇之路由

    目录 原理 angular-route ui-router 事件 深度路由 原理 ng的route本质是监听hashchange事件. 在angular-route中 $rootScope.$on(' ...

  3. 代码实现SQL Server动态行转列，不用存储过程

    分两步查询,第一步查询出动态列,第二步使用PIVOT函数. 代码: List<DataTable> dataTableList = new List<DataTable>(); ...

  4. SQL Server2000导出数据时包含主键、字段默认值、描述等信息

    时经常用SQL Server2000自带的导出数据向导将数据从一台数据库服务器导出到另一台数据库服务器: 结果数据导出了,但表的主键.字段默认值.描述等信息却未能导出,一直没想出什么方法,今天又尝试了 ...

  5. iOS 阶段学习第十天笔记（字符串操作）

    iOS学习(C语言)知识点整理 一.字符串的操作 1)字符串的存储,字符数组,在堆里面申请内存空间. 实例代码: #include <stdlib.h> #include <stri ...

  6. Facebook的Hack语言三大看点

    Hack语言主要有三大看点:类型化.异步.集合. Hack最基础的特性就是类型标注.PHP5已经开始支持对象的类型化,PHP7也提供了标量类型化声明.Hack提供了全面的类型标注支持,与其typech ...

  7. 【转】PHP 5.3 5.4 5.5 5.6特性

    前两天,PHP5.6已经发布了.恐怕我们很多人都停留在5.2时代吧. PHP5.3 (2009-2012) PHP5.3 算是一个非常大的更新,新增了大量新特征,同时也做了一些不向下兼容的修改. 弃用 ...

  8. 使用JPA储存Text类型的时候 出现乱码的问题

    以前遇到这类问题第一个反应就是觉得客户端和服务端的编码不一样导致的.所以一开始也是那么认为的.以为我们项目使用的是pgsql,默认的就是utf-8,然后我们使用了字符也是utf-8,并且还有一个问题就 ...

  9. 2015暑假多校联合---Cake（深搜）

    题目链接:HDU 5355 http://acm.split.hdu.edu.cn/showproblem.php?pid=5355 Problem Description There are m s ...

  10. PHP内核探索之变量（6）- 后续内核探索系列大纲备忘

    年前因为工作比较饱和,现在又忙着换工作的事情,基本停止了对博文的更新.后续的博文,还是慢慢补上吧. 为了不至于过于发散,先搞个未成形的大纲,如下: PHP内核探索之变量  不平凡的字符串 PHP内核探 ...