如何在網頁中動態的顯示日期時間

本文主要說明的是如何在網頁中動態的顯示日期時間,我們這兒使用js來實現,很簡單,一看就會。

爲動態顯示系統時間的javascript代碼及頁面代碼:

  1. <html>  
  2.     <head>  
  3.         <title>網頁中動態的顯示系統日期時間</title>  
  4.         <script language="JavaScript">  
  5.             function startTime()     
  6.             {     
  7.                 var today=new Date();//定義日期對象     
  8.                 var yyyy = today.getFullYear();//通過日期對象的getFullYear()方法返回年      
  9.                 var MM = today.getMonth()+1;//通過日期對象的getMonth()方法返回年      
  10.                 var dd = today.getDate();//通過日期對象的getDate()方法返回年       
  11.                 var hh=today.getHours();//通過日期對象的getHours方法返回小時     
  12.                 var mm=today.getMinutes();//通過日期對象的getMinutes方法返回分鐘     
  13.                 var ss=today.getSeconds();//通過日期對象的getSeconds方法返回秒     
  14.                 // 如果分鐘或小時的值小於10,則在其值前加0,比如如果時間是下午3點20分9秒的話,則顯示15:20:09     
  15.                 MM=checkTime(MM);  
  16.                 dd=checkTime(dd);  
  17.                 mm=checkTime(mm);     
  18.                 ss=checkTime(ss);      
  19.                 var day; //用於保存星期(getDay()方法得到星期編號)  
  20.                 if(today.getDay()==0)   day   =   "星期日 "   
  21.                 if(today.getDay()==1)   day   =   "星期一 "   
  22.                 if(today.getDay()==2)   day   =   "星期二 "   
  23.                 if(today.getDay()==3)   day   =   "星期三 "   
  24.                 if(today.getDay()==4)   day   =   "星期四 "   
  25.                 if(today.getDay()==5)   day   =   "星期五 "   
  26.                 if(today.getDay()==6)   day   =   "星期六 "   
  27.                 document.getElementById('nowDateTimeSpan').innerHTML=yyyy+"-"+MM +"-"+ dd +" " + hh+":"+mm+":"+ss+"   " + day;     
  28.                 setTimeout('startTime()',1000);//每一秒中重新加載startTime()方法   
  29.             }     
  30.               
  31.             function checkTime(i)     
  32.             {     
  33.                 if (i<10){  
  34.                     i="0" + i;  
  35.                 }     
  36.                   return i;  
  37.             }    
  38.         </script>  
  39.     </head>  
  40.     <body onload="startTime()">  
  41.         當前時間:<font color="#33FFFF"><span id="nowDateTimeSpan"></span></font>      
  42.     </body>  
  43. </html>  
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章