`
Everyday都不同
  • 浏览: 725038 次
  • 性别: Icon_minigender_1
  • 来自: 宇宙
社区版块
存档分类
最新评论

setInterval和setTimeout

阅读更多

如题所示的2个方法是很重要的,而以前对它们的认知比较笼统。最近用到了,虽然比较简单但还是好好总结一下~~

 

<html >
	<head>
        
        <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
        
        <script type="text/javascript" >
        var timer;
            $(function() {
                setTimeout(function() {
                    timer = setInterval(call, 3000)
                }, 2000);
            });
            function call() {
                alert("Hebe");
            }
            function cancel() {
                clearInterval(timer);
            }
        </script>
	</head>

	<body>
       <input type="button" value="取消定时器" onclick="cancel()" />
         
	</body>
</html>

 这个小例子,把setInterval和setTimeout的语法都用上了,麻雀虽小、五脏俱全。

 

加载这个页面,会在5s后弹出'Hebe',之后再每隔2s循环弹出'Hebe',一段时间后你点击按钮,则不会再有定时弹出操作了。

 

归纳下一些语法——

1)setTimeout(方法名, 时间/ms) 运用在延迟一段时间,再进行某项操作。注意第一个参数是js方法名,不用带括号。它没有每隔一段时间重复执行的作用;(有误,当有参数的时候还是要带括号,没参数的时候可带可不带)

2)setInterval(方法名, 时间/ms) 运用在每隔一段时间,重复进行某项操作。注意第一次执行该操作时,会在指定的间隔时间之后再执行,而不是立即执行第一次操作,这也是为啥上述小例子是经过5s而不是3s后第一次弹出'Hebe';

3)setTimeout可以通过在他作用的方法里回调方法本身来达到setINterval的效果,即在它作用的js方法里最后再加上这么一句:setTimeout(本方法名, 时间/ms)——这体现了递归;

4)取消定时器,无论是timeout还是interval都是用以下语法:clearTimeout(定时器名)或clearInterval(定时器名);;其中定时器名是你在set的时候赋值的,如var timer = setTimeout(Interval) (方法名, 时间/ms);

5)注意到set操作的对象是js函数名,clear操作的对象是定时器(由set操作产生)。

 

======================================  总结完毕=====================================

 

分享到:
评论

相关推荐

    js中的setInterval和setTimeout使用实例.docx

    javascript 中的 setInterval 和 setTimeout 使用实例 在 javascript 中,有两个重要的定时执行函数,即 setInterval 和 setTimeout。这两个函数都可以用来执行某个函数或表达式,但它们之间有一些关键的区别。 ...

    JavaScript中停止执行setInterval和setTimeout事件的方法

    js 代码中执行循环事件时,经常会用到 setInterval 和 setTimeout 这两个方法,关于这两个方法的细节这里不详细讨论了,简要分享下在需要停止循环事件的时候该如何操作。 (1)setInterval 方法可按照指定的周期(以...

    setInterval和setTimeout停止的方法

    先来了解 setInterval : 1,HTML DOM setInterval() 方法 定义和用法 setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。 setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或...

    js中SetInterval与setTimeout用法.pdf

    在 JavaScript 中,SetInterval 和 setTimeout 是两种常用的定时器函数,用于实现延迟执行或重复执行某些操作。本文将详细介绍这两种函数的用法和区别。 setTimeout 函数 setTimeout 函数用于延迟执行某个函数或...

    Jquery中使用setInterval和setTimeout的方法

    在JQuery中使用setInterval和setTimeout方法是JavaScript编程中的常见需求,特别是在需要周期性执行任务或延时执行任务时。这两个方法虽然语法相近,但功能和使用场景有所区别。在使用时,经常需要结合JQuery的ready...

    js中SetInterval与setTimeout用法

    在 JavaScript 中,SetInterval 和 setTimeout 是两种常用的定时器函数,用于实现延迟执行或重复执行某些操作。下面我们将详细讲解这两种函数的区别和用法。 SetTimeout 函数 SetTimeout 函数用于延迟执行某个函数...

    js中的setInterval和setTimeout使用实例

    JavaScript中的定时执行函数setInterval和setTimeout是Web开发中不可或缺的部分,它们允许开发者在特定时间间隔后执行特定的代码。下面将详细介绍这两个函数的定义、用法、返回值以及使用示例。 1. setInterval() ...

    浅谈JavaScript中setInterval和setTimeout的使用问题

    标题中提到的JavaScript中的setInterval和setTimeout是JavaScript语言中实现定时执行任务的两个非常重要的函数,它们允许开发者安排在特定时间后执行代码块。 描述部分强调了在处理任务量较大时,避免使用...

    Javascript中, setTimeout() 和 setInterval() 的方法

    在JavaScript编程中,`setTimeout()`和`setInterval()`是两个非常关键的函数,它们用于实现异步编程,特别是在处理动画、定时任务或者延迟执行代码时不可或缺。这两个函数都是全局对象`window`的方法,它们的区别...

    javascript之setTimeOut和setInterval的用法

    使用SetInterval和设定延时函数setTimeout 很类似。setTimeout 运用在延迟一段时间,再进行某项操作。

    快速掌握Node.js中setTimeout和setInterval的使用方法

    今天先学下setTimeout和setInterval的使用。 一、setTimeout超时计时器(和GCD中的after类似) 在node.js中可以使用node.js内置的setTimeout(callback,delayMillSeconds,[args])方法。当调用setTime()时回调函数会在...

    setTimeout和setInterval的浏览器兼容性分析

    ### setTimeout和setInterval的浏览器兼容性分析 #### 一、概述 `setTimeout` 和 `setInterval` 是JavaScript中用于处理延时与周期性任务的重要函数。它们被广泛应用于各种前端开发场景,例如页面动画效果、轮询...

    JavaScript中SetInterval与setTimeout的用法详解

    setTimeout 描述 setTimeout(code,millisec) setTimeout() 方法用于在指定的毫秒数后调用函数或计算...setInterval(code,millisec[,”lang”]) 参数 描述 code 必需,要调用的函数或要执行的代码串。 mi

    详解JS中定时器setInterval和setTImeout的this指向问题

    在JavaScript中,`setInterval` 和 `setTimeout` 是两种常用的定时器函数,它们允许开发者安排代码在特定时间点或间隔执行。尽管它们的工作原理相似,但在处理`this`关键字时有一些微妙的区别,尤其是在涉及到对象...

    VUE中setTimeout和setInterval自动销毁案例

    在Vue.js应用中,我们经常会遇到使用`setTimeout`和`setInterval`来实现某些延时或周期性操作。然而,如果不正确地管理这些定时器,它们可能会在组件被销毁后仍然继续运行,导致不必要的资源消耗和潜在的问题。本文...

Global site tag (gtag.js) - Google Analytics