首先在頁面中我們直接寫一個標簽,然後給標簽定義一個id,這裡我們用什麼標簽都可以,我們就用<span></span>演示吧, 代碼如下: 上面我們實例化了一個Clock的對象,這裡我們就在外部定義一個Clock的類, 獲取當前時間併進行時間的格式化,代碼如下: 之後我們在頁面頭部中引入該js就好了: ...
首先在頁面中我們直接寫一個標簽,然後給標簽定義一個id,這裡我們用什麼標簽都可以,我們就用<span></span>演示吧,
代碼如下:
<span id="clock" ></span> <script type="text/javascript"> var clock = new Clock(); clock.display(document.getElementById("clock")); </script>
上面我們實例化了一個Clock的對象,這裡我們就在外部定義一個Clock的類,
獲取當前時間併進行時間的格式化,代碼如下:
function Clock() { var date = new Date(); this.year = date.getFullYear(); this.month = date.getMonth() + 1; this.date = date.getDate(); this.day = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[date.getDay()]; this.hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(); this.minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(); this.second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds(); this.toString = function() { return "現在是:" + this.year + "年" + this.month + "月" + this.date + "日 " + this.hour + ":" + this.minute + ":" + this.second + " " + this.day; }; this.toSimpleDate = function() { return this.year + "-" + this.month + "-" + this.date; }; this.toDetailDate = function() { return this.year + "-" + this.month + "-" + this.date + " " + this.hour + ":" + this.minute + ":" + this.second; }; this.display = function(ele) { var clock = new Clock(); ele.innerHTML = clock.toString(); window.setTimeout(function() {clock.display(ele);}, 1000); }; }
之後我們在頁面頭部中引入該js就好了:
<script src="js/Clock.js" type=text/javascript></script>
顯示效果: