setTimeout和setInterval
setTimeout(methodName, interval); //间隔时间单位为毫秒，表示interval毫秒后执行方法methodName
setInterval(methodName, interval); //间隔时间单位为毫秒，表示每隔interval毫秒执行后都会执行一次方法methodName
执行的方法可以带参数，但是参数只能是字符串、数字类的，不能是对象
实例代码：
1 <html> 2 <head> 3 <title>标题</title> 4 <meta charset="utf8"/> 5 <script type="text/javascript"> 6 //测试setTimeout 7 var runTimeout, runInteval; 8 function TestTimeout(idName){ 9 if (!idName) idName = "showInfo"; 10 11 document.getElementById(idName).innerText = (new Date()) + ", runTimeout = " + runTimeout; 12 runTimeout = setTimeout("TestTimeout('showInfo')", 1000); //一秒后执行 13 //或者写作：runTimeout = setTimeout(TestTimeout, 1000); //一秒后执行 14 } 15 16 function TestClearTimeout(){ 17 clearTimeout(runTimeout); 18 runTimeout = null; 19 document.getElementById("showInfo").innerText = "setTimeout()停止了, runTimeout = " + runTimeout; 20 } 21 22 //测试setInterval 23 function ChangeTime(idName){ 24 document.getElementById(idName).innerText = (new Date()) + ", runInteval = " + runInteval + ", runTimeout = " + runTimeout; 25 } 26 27 function TestInterval(){ 28 if (runInteval){ 29 return; 30 } 31 runInteval = setInterval("ChangeTime('showInfo2')", 1000); //每过一秒就调用ChangeTime()方法 32 //或者写作：runInteval = setInterval(ChangeTime, 1000);//需要带参数的话就用上面那种写法 33 } 34 //停止setInterval 35 function TestClearInterval(){ 36 clearInterval(runInteval); 37 runInteval = null; 38 document.getElementById("showInfo2").innerText = "setInterval()停止了, runInteval = " + runInteval; 39 } 40 41 42 </script> 43 </head> 44 <body> 45 <h3 id="showInfo"></h3> 46 <h3 id="showInfo2"></h3> 47 <input type="button" value="测试timeout" onclick="TestTimeout()"/> 48 <input type="button" value="停止timeout" onclick="TestClearTimeout()"/> 49 <input type="button" value="测试interval" onclick="TestInterval()"/> 50 <input type="button" value="停止interval" onclick="TestClearInterval()" /> 51 </body> 52 </html>
分类:
大前端
标签:
setTimeout
, setInterval
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试？测试工程师会被淘汰吗？