关于setTimeout和setInterval的用法

最新推荐文章于 2025-07-18 15:39:47 发布

转载最新推荐文章于 2025-07-18 15:39:47 发布 · 926 阅读

文章标签：

#input #date #div

[18]-JAVASCRIPT 专栏收录该内容

6 篇文章

订阅专栏

本文详细介绍了JavaScript中的setTimeout和setInterval函数的使用方法及区别。通过具体示例展示了如何利用这两个函数来实现页面定时更新时间的功能，并解释了它们与clearTimeout及clearInterval的配合使用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

setTimeout(表达式,延迟时间); 单位:ms(毫秒)；1s=1000ms;
setInterval(表达式,交互时间); 单位:ms(毫秒)；1s=1000ms;

window.setTimeout()
在执行时，它从载入后延迟指定的时间去执行一个表达式或者是函数;仅执行一次;和window.clearTimeout一起使用.

window.setInterval()
在执行时,它从载入页面后每隔指定的时间执行一个表达式或者是函数;(功能类似于递归函数)；和window.clearInterval一起使用.

举个例子吧！

< script>
function showtime( ){
var otime = new Date( );
var mytime = otime.getHours()+':'+otime.getMinutes()+':'+otime.getSeconds();
document.getElementById('mytext').value = mytime;
window.clearTimeout(tt);
var tt = setTimeout("showtime()",1000);//也可以写成 var tt = setTimeout(showtime,1000);
}
< /script>

< input type=text id='mytext'>
< div onclick='setTimeout("showtime()",1000)'>设置< /div>

//上面的代码实现是时钟，在来看一下用
// setInterval实现此效果

< script>
function showtime( ){
var otime = new Date( );
var mytime = otime.getHours()+':'+otime.getMinutes()+':'+otime.getSeconds();
document.getElementById('mytext').value = mytime;
}
< /script>

< input type=text id='mytext'>
< div onclick='setTimeout("showtime()",1000)'>设置< /div>