Neil coding之路

  var h1=0,m1=0,s1=0;   //當hour,minute,second轉一圈把它多加360度
  function settime()
  {
     var nowdate=new Date(); //取得時間
     (!nowdate.getHours()&&!nowdate.getMinutes()&&!nowdate.getSeconds())&&h1++; //當hour and minute and second 都為0時 h1++ 
     (!nowdate.getMinutes()&&!nowdate.getSeconds())&&m1++; //當minute and second 都為0時 m1++ 
     (!nowdate.getSeconds())&&s1++; //second 都為0時 s1++ 
     var hour=(nowdate.getHours()-3)*(360/12)+360*h1; //360除以12 小時為12等分 3的位置為rotate(0)  所以要減3
     var min=(nowdate.getMinutes()-15)*(360/60)+360*m1; //360除以60 分為60等分 3的位置為rotate(0) 所以要減3*5
     var sec=(nowdate.getSeconds()-15)*(360/60)+360*s1; //360除以60 秒為60等分 3的位置為rotate(0)  所以要減3*5
     var hour_hand=document.querySelector(".hour-hand"); //抓取小時 dom
     var min_hand=document.querySelector(".min-hand");   //抓取min dom
     var second_hand=document.querySelector(".second-hand"); //抓取sec dom
    
     hour_hand.style.transform="rotate("+hour+"deg)"; //set hour
     min_hand.style.transform="rotate("+min+"deg)"; //set min
     second_hand.style.transform="rotate("+sec+"deg)"; //set sec
  }
  settime(); //一開始觸發
  setInterval(settime,1000); //間隔一秒觸發函數

技術參考:SetinterVal transform

demo:Javascript30