使用純HTML5編寫一款網頁上的時鐘的代碼分享

這篇文章主要介紹了使用純HTML5編寫一款網頁上的時鐘的代碼分享,程序非常簡單且沒有時鐘上的數字顯示,純粹體現最基本的設計思路,需要的朋友可以參考下

你需要知道的：

canvas標籤只是圖形容器，您必須使用腳本來繪製圖形。默認大小：寬300px，高150px;

getContext() 方法可返回一個對象，該對象提供了用於在畫布上繪圖的方法和屬性。 -獲取上下文對象。

getContext(2d) 對象屬性和方法，可用於在畫布上繪製文本、線條、矩形、圓形等等。

fillRect(l,t,w,h)：默認顏色是黑色strokeRect(l,t,w,h):帶邊框的方塊。默認一像素黑色邊框

setInterval() 方法可按照指定的周期（以毫秒計）來調用函數或計算表達式。

beginPath()：定義開始繪製路徑, 它把當前的點設置為(0,0)。 當一個畫布的環境第一次創建，beginPath()

方法會被顯式地調用。

closePath()：結束繪製路徑（將起點與終點進行連接）

繪製圓形：

arc（ x,y,半徑,起始弧度，結束弧度,旋轉方向）

x,y：起始位置

弧度與角度的關係：弧度=角度*Math.PI/180

旋轉方向：順時針（默認：false，逆時針：true）

代碼：