原生JS實現動態時鐘(優化)
阿新 • • 發佈:2019-01-12
chan js實現 meta 文檔 時鐘 全局 tint min title
<!doctype html> <html> <head> <meta charset="utf-8"> <title>無標題文檔</title> </head> <body> <p id="num"></p> <a href="javascript:stop()">讓時間停止吧</a> <a href="javascript:goon()">讓時間繼續吧</a> </body> </html> <script> //向段落裏面寫入數字1: var oP = document.getElementById("num"); function changeTime(){ var odate = new Date(); //說明:當前的日期對象,要想實時獲得當前的時間,就需要實時的獲得當前的日期對象 var year = odate.getFullYear(); var month = odate.getMonth()+1; month = month < 10 ? ‘0‘+month:month;var day = odate.getDate(); day = day < 10 ? ‘0‘+day:day; var hour = odate.getHours(); var minute = odate.getMinutes(); var second = odate.getSeconds(); oP.innerHTML = "當前時間:"+year+‘-‘+month+‘-‘+day+‘ ‘+hour+‘:‘+minute+‘:‘+second; }//var timer = setInterval(changeTime(), 1000); //先調用函數,每隔1秒執行返回的結果 var timer = setInterval(changeTime, 1000); //每隔1秒,通過changeTime變量找到function體並執行 //讓時間繼續切換,每隔1秒執行一次 function goon(){ clearInterval(timer); //表示使用的就是全局的變量 timer = setInterval(changeTime, 1000); } //清除定時器,參數就是設置定時器時返回的結果 function stop() { clearInterval(timer); } </script>
原生JS實現動態時鐘(優化)