1. 程式人生 > 程式設計 >js實現時鐘定時器

js實現時鐘定時器

本文例項為大家分享了js實現時鐘定時器的具體程式碼,供大家參考,具體內容如下

<!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>

js實現時鐘定時器

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支援我們。