天天看點

JavaScript實作網頁時鐘

實作原理:擷取目前伺服器時間,然後進行拆分後再合并,并應用 定時器,注意月份是0 到11

<!DOCTYPE html>
<html>
<head>
	<title>時鐘</title>
	<script type="text/javascript">
		window.onload = function(){
			var oDiv  = document.getElementsByTagName('div')[0];
			//alert(oDiv);
			function fnTimeGo(){
				var sNow = new Date();
				var iYear  = sNow.getFullYear();
				var iMonth = sNow.getMonth()+1;
				var iDay = sNow.getDate();
				var iWeek = sNow.getDay();
				var iHore = sNow.getHours();
				var iMin =sNow.getMinutes();
				var iSecond = sNow.getSeconds();

				var Str = '中原標準時間:'+iYear+'年'+iMonth+'月'+iDay+'日 '+ fnToweek(iWeek) +' '+ fnTodou(iHore)+':'+fnTodou(iMin)+':'+fnTodou(iSecond);

				oDiv.innerHTML = Str

			}

			//先行調用一次,解決1秒延遲問題
			fnTimeGo();
			//設定定時器,每隔1秒更新一次時間
			setInterval(fnTimeGo,1000);

			function fnToweek(i){
				if(i==0){return '星期日'}
				else if(i==1){return '星期一'}
				else if(i==2){return '星期二'}
				else if(i==3){return '星期三'}
				else if(i==4){return '星期四'}
				else if(i==5){return '星期五'}
				else {return '星期六'}
				}

			function fnTodou(i){
				if(i<10){return '0'+i ;}
					else return i ;
				}

		}
	</script>

	<style type="text/css">
		div{
			text-align: center;
			font-size: 30px;
			color: gold;
		}
	</style>
</head>
<body>
	<div id="div1"></div>
</body>
</html>
           

繼續閱讀