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. Azure China (11) 使用Azure China Storage Public Blob

    <Windows Azure Platform 系列文章目录> 本文介绍的是国内由世纪互联运维的Azure China 注意:本文介绍的是Azure China Storage Publi ...

  2. UWP开发入门（二十三）——WebView

    本篇讨论在UWP开发中使用WebView控件时常见的问题,以及一些小技巧. WebView是实际开发中常用的控件,很多大家抱怨的套网页的应用都是通过WebView来实现的.这里要澄清一个问题,套网页的 ...

  3. l5如何通过路由走api版本回退查找设置

    l5如何通过路由走api版本回退查找设置 具体需求 当前遇到的问题是使用laravel写接口,但是接口是有版本号的,我们把版本号放在url中,比如: http://yejianfeng.com/api ...

  4. 前端scss的使用及gulp发布方式

    如标题所述,这篇博文是说scss以及gulp发布方式: 如果你没用过scss和gulp或不甚了解,你可以看看这篇博文,叙说的水平有限,各位看官大神见谅: 说scss之前,先来说说sass,sass是一 ...

  5. c#如何采集需要登录的页面

    首先说明:代码片段是从网络获取,然后自己修改.我想好的东西应该拿来分享. 先说下原理:当我们采集页面的时候,如果被采集的网站需要登录才能采集.不管是基于Cookie还是基于Session,我们都会首先 ...

  6. Document

    每个载入浏览器的 HTML 文档都会成为 Document 对象.Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问.提示:Document 对象是 Window 对象的一 ...

  7. [控件] 加强版 TOneSelection (改良自 Berlin 10.1 TSelection)

    本控件修改自 Delphi Berlin 10.1 的 TSelection (FMX.Controls.pas) 修改重点: 移动点显示在上方 增加(左中,上中,右中,下中)控制点,含原来的总共有 ...

  8. 2015暑假多校联合---Problem Killer（暴力）

    原题链接 Problem Description You are a "Problem Killer", you want to solve many problems. Now ...

  9. [javaEE] 反射-通过反射了解集合泛型本质

    java中的泛型是防止错误输入的,只在编译时刻起作用 package com.tsh.reflect; import java.lang.reflect.Method; import java.uti ...

  10. [python拾遗]文件操作

    文件操作 1.open()函数 open()函数主要用于文件处理,一般分为下面3个过程: 1.打开文件 2.操作文件 3.关闭文件 常见的格式示例: f = open('note.txt','r') ...