當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript中setInterval,setTimeout的区别跟用法
生活随笔
收集整理的這篇文章主要介紹了
javascript中setInterval,setTimeout的区别跟用法
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
setInterval() 方法可按照指定的周期（以毫秒計）來調用函數或計算表達式。
setInterval() 方法會不停地調用函數，直到 clearInterval() 被調用或窗口被關閉。
setTimeout只運行一次，也就是說設定的時間到后就觸發運行指定代碼，運行完后即結束。
下面是setInterval來取貨系統當前時間
<!DOCTYPE HTML> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <meta http-equiv="Content-Language" content="zh-cn" /> <title>獲取系統時間</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <style type="text/css"> *{margin: 0px; padding: 0px; font-size:14px; font-family:'微軟雅黑'; } .clearfix:after{content:'.';display:block;height:0;clear:both;visibility:hidden} .clearfix{display:inline-block;} * html .clearfix{height:1%} .clearfix{display:black;} ul li{list-style:none; } </style> </head> <body> <script type="text/javascript"> window.onload = function(){ showTime(); function toDou(num){if(num<10){return '0'+num;}else{return ''+num;} } function showTime(){var date = new Date();var Time = $('Nowtime');var str = toDou(date.getFullYear())+'年'+toDou(date.getMonth())+'月'+toDou(date.getDate())+'日'+toDou(date.getHours())+'時'+toDou(date.getMinutes())+'分'+toDou(date.getSeconds())+'秒';Time.innerHTML = str; } setInterval(showTime,1000); } function $(id){return document.getElementById(id); } </script> <p>現在時間：<span id='Nowtime'></span></p> </body> </html>下面是用setInterval與clearInterval簡單的用法
?
<!DOCTYPE HTML> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <meta http-equiv="Content-Language" content="zh-cn" /> <title>setInterval與clearInterval</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <style type="text/css"> *{ margin: 0px; padding: 0px; font-size:14px; font-family:'微軟雅黑'; } .clearfix:after{content:'.';display:block;height:0;clear:both;visibility:hidden} .clearfix{display:inline-block;} * html .clearfix{height:1%} .clearfix{display:black;} ul li{ list-style:none; } </style> </head> <body> <script type="text/javascript"> window.onload = function(){ var oBtn = $('btn'); var oBtn1 = $('btn1'); var oTxt = $('txt'); var i=0; var timer = null; oBtn.onclick = function(){ timer = setInterval(function(){ i++; oTxt.value = i; if(i==100){ clearInterval(timer); } },1000); } oBtn1.onclick = function(){ clearInterval(timer); } } function $(id){ return document.getElementById(id); } </script> <input type='text' id='txt' value='0'><input type='button' value='開始' id='btn'><input type='button' value='關閉' id='btn1'> </body> </html>轉載于:https://www.cnblogs.com/xiaoxiaosha/p/3632253.html
總結
以上是生活随笔為你收集整理的javascript中setInterval,setTimeout的区别跟用法的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 编程模式如何结束未响应的程序
- 下一篇： dotNet中初始化器的使用