js實現(xiàn)時鐘定時器
更新時間:2020年03月26日 14:10:33 作者:JackieDYH
這篇文章主要為大家詳細介紹了js實現(xiàn)時鐘定時器,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實例為大家分享了js實現(xiàn)時鐘定時器的具體代碼,供大家參考,具體內(nèi)容如下
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>時鐘</title> <script type="text/javascript"> function showClock(){ // 1. 獲取當前時間 var time = new Date(); // document.write(time); var year = time.getFullYear(); // document.write(year); var month = time.getMonth() + 1; // document.write(month); var day = time.getDate(); // var day1 = time.getDay(); // document.write(day1); var hours = time.getHours(); // document.write(hours); var minutes = time.getMinutes(); // document.write(minutes); var seconds = time.getSeconds(); document.getElementById("clock").innerHTML = year+"-"+month+"-"+day+" " +hours+":"+minutes+":"+seconds; } var flag = true; var id; function runClock(){ var btn = document.getElementById("btn"); if(flag){ // 計時操作 id = setInterval("showClock()",1000); flag = false; btn.innerHTML = "停止"; }else{ // 停止計時操作 clearInterval(id); flag = true; btn.innerHTML = "動起來"; } } </script> </head> <body> <button οnclick="showClock()">點擊顯示時鐘</button> <div id="clock"> </div> <button id="btn" οnclick="runClock()">動起來</button> </body> </html>
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關文章
關于IE中getElementsByClassName不能用的問題解決方法
今天使用getElementsByClassName寫了段小程序,在IE6、8中測試的時候就出現(xiàn)問題了,瀏覽器報錯,經(jīng)搜索找到了一個比較好的方法,是個老外寫的一個方法2013-08-08bootstrap+jQuery實現(xiàn)的動態(tài)進度條功能示例
這篇文章主要介紹了bootstrap+jQuery實現(xiàn)的動態(tài)進度條功能,結(jié)合完整實例形式分析了bootstrap+jQuery實現(xiàn)動態(tài)進度條的具體步驟與相關操作技巧,需要的朋友可以參考下2017-05-05