1.概述
在瀏覽很多網站時，都會發現在網站中加入了顯示當前系統時間的功能，在網頁中顯示當前系統時間，不僅可以方便瀏覽者掌握當前時間，而且還美化了網頁。
2.技術要點
利用Date對象來實現。首先創建一個表示當前系統時間的Date()對象，然后通過Date對象的getXxx()方法獲得當前系統時間的年、月、日、小時、分、秒和星期的值，接下來將獲得的這些值組合成一個日期時間字符串，并將日期時間字符串設置成為<div>標簽的內容，最后通過window對象的setTimeout()函數每隔1秒調用一個實時顯示系統時間的函數。
3.具體實現
（1）新建index.jsp頁，編寫實時顯示系統時間的JavaScript函數，關鍵代碼如下：
/***實時顯示系統時間*/function getLangDate(){var dateObj = new Date(); //表示當前系統時間的Date對象 var year = dateObj.getFullYear(); //當前系統時間的完整年份值var month = dateObj.getMonth()+1; //當前系統時間的月份值 var date = dateObj.getDate(); //當前系統時間的月份中的日var day = dateObj.getDay(); //當前系統時間中的星期值var weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];var week = weeks[day]; //根據星期值，從數組中獲取對應的星期字符串 var hour = dateObj.getHours(); //當前系統時間的小時值 var minute = dateObj.getMinutes(); //當前系統時間的分鐘值var second = dateObj.getSeconds(); //當前系統時間的秒鐘值//如果月、日、小時、分、秒的值小于10，在前面補0if(month<10){month = "0"+month;}if(date<10){date = "0"+date;}if(hour<10){hour = "0"+hour;}if(minute<10){minute = "0"+minute;}if(second<10){second = "0"+second;}var newDate = year+"年"+month+"月"+date+"日 "+week+" "+hour+":"+minute+":"+second;document.getElementById("dateStr").innerHTML = "系統公告：[ "+newDate+" ]";setTimeout("getLangDate()",1000);//每隔1秒重新調用一次該函數 } （2）在頁面<body>標簽中通過onload事件加載步驟（1）中編寫的JavaScript函數，并在頁面的適當位置加入<div>標簽，id為“dateStr“，關鍵代碼如下：
<body onLoad="getLangDate()"><div id="dateStr" class="word_grey"></div></body>
在實現實時顯示系統時間時，還可以使用window對象的setIntervar()方法，setInterval()方法類似于setTimeout()方法。
不同之處是調用window對象的setIntervar()方法后，會一直執行setIntervar()方法所調用的JavaScript方法，而setTimeout()方法只能被執行一次。如果要通過setTimeout()方法一直執行某個JavaScript方法，setTimeout()必須寫在被調用的JavaScript方法體內。
以上所述是小編給大家介紹的基于JS代碼實現實時顯示系統時間的相關知識，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！
新聞熱點
疑難解答
