codetc - 网站开发技术 首页 前端 查看内容

JS中setInterval和setTimeout的用法分析

2015-3-3 19:47| 发布者: CODETC| 查看: 2154| 评论: 0

setTimeout和setInterval这两个函数, 相信大家肯定都不陌生, 但并不是每个用过这两个方法的同学, 都了解其内部的实质,setTimeout和setInterval的作用其实是把你要执行的代码在你设定的一个时间点插入js引擎维护的一个代码队列中, 等到到达所设定的时间才执行,setTimeout和setInterval还有点不一样。


setInterval() 定义和用法

setInterval() 方法可按照指定的周期(以毫秒计)来执行函数或表达式。该方法会不停地循环调用函数,直到使用 clearInterval() 明确停止该函数或窗口被关闭。clearInterval() 函数的参数即 setInterval() 返回的 ID 值。

语法

setInterval(code,millisec[,"lang"])

code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔,以毫秒计。

返回值

一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。

使用示例:

<script language=javascript>
var int=setInterval("clock()",50);
function clock(){
	var t=new Date();
	document.getElementById("clock").value=t;
}

//window.clearInterval(int); 清除setInterval()
</script>

setTimeout() 定义和用法

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,该方法与 setInterval() 方法不同的是该方法只执行一次。

语法

setTimeout(code,millisec)

code 必需。要调用的函数后要执行的 JavaScript 代码串。
millisec 必需。在执行代码前需等待的毫秒数,以毫秒计。

提示:

(1)setTimeout() 虽然是只执行一次代码。但如果许要多次调用,除了使用 setInterval() 外还可以让被执行的代码里面自身再次调用 setTimeout() 方法已达到多次执行的目的。
(2)另外setTimeout()方法也同样可以返回一个ID值,以方便使用clearInterval()方法对使用setTimeout()方法的取消。

使用示例:

<script type="text/javascript">
//3 秒后弹出警告
function timedMsg(){
	var t=setTimeout("alert('3 秒时间到!')",3000);
}
//循环 每 3 秒弹出一次警告
function timedMsgAways(){
	alert('3 秒时间到!');
	var t=setTimeout("timedMsgAways()",3000);
}
</script>


对于这两个方法,需要注意的是如果要求在每隔一个固定的时间间隔后就精确地执行某动作,那么最好使用setInterval,而如果不想由于连续调用产生互相干扰的问题,尤其是每次函数的调用需要繁重的计算以及很长的处理时间,那么最好使用setTimeout。

文章来源 CODETC,欢迎分享,转载请注明地址: http://www.codetc.com/article-148-1.html

最新评论

 作为游客发表评论,请输入您的昵称

返回顶部