[转载]WEB中实时时间的显示

WEB中实时时间的显示

当你进入一个网站时，是否看到里面的一个非常体贴的时间提示，好象网易社区的小秘书，会按时间提示你一些东西。其实实现起来也没什么困难，下面一步一步来吧！

1、必须取得系统当前时间，在JavaScript中，可以用var now = new Date()来创建一时间对象，然后我们就可以用创建的Date对象来取得我们需要的东西了。

年：now.getYear()
月：now.getMonth()
日：now.getDate()
时：now.getHour()
分：now.getMinutes()
秒：now.getSeconds()
星期：now.getDay()

有了这些，我们就足够来实现上面的功能了
2、加工，处理一下
这里有两个地方要注意：
1) getMonth()，得到的值0-11的，比如现在是7月份，而用getMonth()得到的值是6，所以显示出来要+1
2) getDay()中，星期天=0，星期一=1，……，星期六=6
现在可以处理了：
比如我们要显示的是：2004年7月1日 星期四 现在的时间是：10:52:53 其中，时间是实时的，就是会一秒一秒的加上去的
now.getYear()+"年"+(now.getMonth()+1)+"月"+now.getDate()+"日"
日期部分完成了
getDay()得到的是数字，所以星期部分要处理一下：
weeks=now.getDay();
if (weeks == 0)
weeks = "星期天";
else if (weeks == 1)
weeks = "星期一";
else if (weeks == 2)
weeks = "星期二";
else if (weeks == 3)
weeks = "星期三";
else if (weeks == 4)
weeks = "星期四";
else if (weeks == 5)
weeks = "星期五";
else
weeks = "星期六";
这样，我们的星期也行了
时间部分也同样： nnow.getHour()+":"+now.getMinutes()+":"+now.getSeconds()

3、在body标签中，用 onload="startClock();" 就可以显示出来了

要实现实时用setTimeout(运行的function, 1000)，这样就1秒钟运行一次了。
OK，我们就得到了我们要的结果了，如果要象网易那样的小秘书，只要判断一下时间是什么时候，就显示什么提示就行了，是不是很简单呀！

下面附上全部源码：

? var timerID = null
? var timerRunning = false
? function stopClock() {
??? if(timerRunning)
??? clearTimeout(timerID);
??? timerRunning = false
??? this.clock.innerHTML = "";
? }
? function showTime() {
??? var now = new Date();
??? var year = now.getYear();
??? var month = now.getMonth() + 1;
??? var date = now.getDate();
??? var hours = now.getHours();
??? var mins = now.getMinutes();
??? var secs = now.getSeconds();
??? var weeks = now.getDay();
??? var timeVal =? year + "年";
??? timeVal += month + "月";
??? timeVal += date + "日 ";
???
??? if (weeks == 0)
????? timeVal += "星期天";
??? else if (weeks == 1)
????? timeVal += "星期一";
??? else if (weeks == 2)
????? timeVal += "星期二";
??? else if (weeks == 3)
????? timeVal += "星期三";
??? else if (weeks == 4)
????? timeVal += "星期四";
??? else if (weeks == 5)
????? timeVal += "星期五";
??? else
????? timeVal += "星期六";
???
??? timeVal += " ";
???
??? if(hours????? timeVal += "凌晨";
??? else if(hours????? timeVal += "上午";
??? else if(hours????? timeVal += "中午";
??? else if(hours????? timeVal += "下午";
??? else
????? timeVal += "晚上";
??? timeVal += ((hours ??? timeVal += ((mins ??? timeVal += ((secs ???
??? this.clock.innerHTML = timeVal;
??? timerID = setTimeout("showTime()", 1000);
??? timerRunning = true;
? }
? function startClock() {
??? stopClock();
??? showTime();
? }

北京时间

显示结果：

var TimerID = null var TimerRunning = false function stopClock1() { if(TimerRunning) clearTimeout(TimerID); TimerRunning = false this.Clock1.innerHTML = ""; } function showTime1() { var now = new Date(); var year = now.getYear(); var month = now.getMonth() + 1; var date = now.getDate(); var hours = now.getHours(); var mins = now.getMinutes(); var secs = now.getSeconds(); var weeks = now.getDay(); var Time1Val = year + "年"; Time1Val += month + "月"; Time1Val += date + "日 "; if (weeks == 0) Time1Val += "星期天"; else if (weeks == 1) Time1Val += "星期一"; else if (weeks == 2) Time1Val += "星期二"; else if (weeks == 3) Time1Val += "星期三"; else if (weeks == 4) Time1Val += "星期四"; else if (weeks == 5) Time1Val += "星期五"; else Time1Val += "星期六"; Time1Val += " "; if(hours

点击开查看运行效果

-by ARTHUR

来自 “ ITPUB博客 ” ，链接：http://blog.itpub.net/374079/viewspace-131090/，如需转载，请注明出处，否则将追究法律责任。