大家好，欢迎来到IT知识分享网。
▐ 什么是计时器?
通过使用JavaScript，我们可以做到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行，也称之为计时事件.
▐ 常用方法：
○ setTimeout
• 用法：setTimeout ( “函数” , “时间” )
• 含义：表示延迟 “指定时间” 后调用 “指定函数” ，且只调用一次.
⚿代码演示及解读：
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script> function start(){ //定时器调用函数 setTimeout("test()",2000);//延迟2s后调用test函数,只调用了一次 } function test(){ alert("javascript"); } </script> </head> <body> <input type="button" value="开始" onclick="start()"/> </body> </html>
○ clearTimeout
• 用法：clearTimeout ( “number” )
• 含义：关闭setTimeout定时器
这里的参数number是定时器开始时，setTimeout返回的一个整数编号
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script> var t; //计时器setTimeout开始时会返回的一个整数编号 function start(){ //定时器调用函数 t = setTimeout("test()",2000);//延迟2s后调用test函数,只调用了一次 } function test(){ alert("javascript"); } function stop(){ //关闭定时器 clearTimeout(t); } </script> </head> <body> <input type="button" value="开始" onclick="start()"/> <input type="button" value="停止" onclick="stop()"/> </body> </html>
○ setInterval
• 用法：setInterval ( “函数” , “时间” )
• 含义：表示每隔 “指定时间” 就调用一次 “指定函数” ，只要不关闭定时器就会一直调用.
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script> var t; //计时器setInterva开始时会返回的一个整数编号 function start(){ //定时器调用函数 t=setInterval("test()",2000);//每隔2s就调用一次test() } function test(){ alert("javascript"); } </script> </head> <body> <input type="button" value="开始" onclick="start()"/> </body> </html>
○ clearInterval
• 用法：clearTimeout ( “number” )
• 含义：关闭setInterval定时器
同理，这里的参数number是定时器开始时，setInterva返回的一个整数编号
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script> var t; function start(){ //定时器调用函数 t=setInterval("test()",2000);//每隔指定时间就调用一次 } function test(){ alert("javascript"); } function stop(){ //清除定时器 clearInterval(t); } </script> </head> <body> <input type="button" value="开始" onclick="start()"/> <input type="button" value="关闭" onclick="stop()"/> </body> </html>
▐ 结语：
计时器在网页设计中还是很常用的，比如图片自动轮播，自动切换等。这篇文章我以弹窗效果为例，主要为了方便大家理解计时器的效果；有时间的话大家可以尝试做一个图片自动切换的效果，进一步巩固这块的知识。
🎯本次的分享就到此为止了，希望我的分享能给您带来帮助，创作不易也欢迎大家三连支持，你们的点赞就是博主更新最大的动力🎯如有不同意见，欢迎评论区积极讨论交流，让我们一起学习进步🎯有相关问题也可以私信博主，评论区和私信都会认真查看的，我们下次再见🎯
⌛海漫浩浩,我亦苦作舟!大家一起学习,一起进步! 🖇️本人微信：g2279605572
免责声明：本站所有文章内容,图片，视频等均是来源于用户投稿和互联网及文摘转载整编而成，不代表本站观点，不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益，请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权，请联系删除，如若转载，请注明出处：https://haidsoft.com/110575.html
