setTimeout 和 setInteval

最新推荐文章于 2024-05-23 11:01:45 发布

hngmduyi

最新推荐文章于 2024-05-23 11:01:45 发布

阅读量1.1k

点赞数

分类专栏： javascript 文章标签： input button function javascript date 文档

javascript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

window对象有两个主要的定时方法，分别是setTimeout 和 setInteval 他们的语法基本上相同，但是完成的功能取有区别。

　　setTimeout方法是定时程序，也就是在什么时间以后干什么。干完了就拉倒。

　　setInterval方法则是表示间隔一定时间反复执行某操作。

　　如果用setTimeout实现setInerval的功能，就需要在执行的程序中再定时调用自己才行。如果要清除计数器需要根据使用的方法不同，调用不同的清除方法：

setTimeout (表达式,延时时间)//切记表达式是要加引号的；
setInterval(表达式,交互时间)
延时时间/交互时间是以豪秒为单位的(1000ms=1s)

这两种方法可能看起来非常像，而且显示的结果也会很相似，不过两者的最大区别就是，setTimeout方法不会每隔5秒钟就执行一次showTime函数，它是在每次调用setTimeout后过5秒钟再去执行showTime函数。这意味着如果showTime函数的主体部分需要2秒钟执行完，那么整个函数则要每7秒钟才执行一次。而setInterval却没有被自己所调用的函数所束缚，它只是简单地每隔一定时间就重复执行一次那个函数。

setTimeout 在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次
setInterval 在执行时,它从载入后,每隔指定的时间就执行一次表达式

<html>
<head>
<title>无标题文档</title>
<script type="text/javascript" language="javascript">
var myTime;
function showTime(){
var time = new Date( ); //获得当前时间
var hour = time.getHours( ); //获得小时、分钟、秒
var minute = time.getMinutes( );
var second = time.getSeconds( );
document.form1.myclock.value =hour+":"+minute+":"+second ;
}
myTime = setInterval("showTime()",1000);
function stopTime(){
clearInterval(myTime);
}
function startTime(){
myTime=setInterval("showTime()",1000);
}
</script>
</head>
<body >
<form name="form1">
<h2>当前时间：
<input type="text" size="10" name="myclock"/>
</h2>
<p>
<label>
<input type="button" name="" value="停止" onClick="stopTime()">
<input type="button" name="" value="开始" onClick="startTime()">
</label>
</p>
</form>
</body>
</html>

hngmduyi

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
setTimeout 和 setInteval

window对象有两个主要的定时方法，分别是setTimeout 和 setInteval 他们的语法基本上相同，但是完成的功能取有区别。　　setTimeout方法是定时程序，也就是在什么时间以后干什么。干完了就拉倒。　　setInterval方法则是表示间隔一定时间反复执行某操作。　　如果用setTimeout实现setInerval的功能，就需要在执行的程序中再定时调用自
复制链接

扫一扫