<!--关键步骤:
1,在script中用new Date()创建时间对象(var 时间集变量名=new Date();),通过创建的对象获取系统当前时间信息(var 变量名=时间集变量名.getYear();等)并保存下来-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>显示时间</title>
<script language="javascript">
document.write("<h3 align = center>"+"用javascript在html中实现计算机系统时间显示功能演示!"+"</h3>");
function showTime(){
var date=new Date(); //获取时间集
<!--获取年月日时分秒 -->
var year =date.getYear();
var month=date.getMonth()+1;
var day=date.getDate();
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
<!--获取一周中系统日期的编号,星期天开始编号,编号从0开始;即星期天的编号为0...-->
var myWeekDay = date.getDay();
var weekDay = "";
<!--根据日期在一周中的编号确定weekDay的值 ;-->
//或者直接weekDay = '星期'+'日一二三四五六'.charAt(date.getDay() or myWeekDay);
if(myWeekDay==0) weekDay = "星期日";
if(myWeekDay==1) weekDay = "星期一";
if(myWeekDay==2) weekDay = "星期二";
if(myWeekDay==3) weekDay = "星期三";
if(myWeekDay==4) weekDay = "星期四";
if(myWeekDay==5) weekDay = "星期五";
if(myWeekDay==6) weekDay = "星期六";
<!--定义变量根据需求按自己喜欢的格式保存日期-->
var word = "";
if(hours < 6){word="AM 凌晨好!";}
else if (hours < 9){word="AM 早上好!";}
else if (hours < 12){word="AM 上午好!";}
else if (hours < 14){word="NOON 中午好!";}
else if (hours < 17){word="PM 下午好!";}
else if (hours < 19){word="PM 傍晚好!";}
else if (hours < 22){word="PM 晚上好!";}
else {word="DEEP NIGHT 深夜好!";}
if(month.toString().length == 1){ //或者用if (eval(month) <10) {month="0"+month}
month='0'+month;
}
if(day.toString().length == 1){
day='0'+day;
}
if(hours.toString().length == 1){
hours='0'+hours;
}
if(minutes.toString().length == 1){
minutes='0'+minutes;
}
if(seconds.toString().length == 1){
seconds='0'+seconds;
}
<!--按自己喜欢的格式保存日期-->
var formatTime=year+"年"+month+"月"+day+"日 "+hours+":"+minutes+":"+seconds+" "+weekDay+" "+word; //或者var time = date.toLocaleString()+word;
<!--2,实现动态刷新1.setTimeout("self.location.reload();",1000); 2.window.setInterval('showTime()',1000)3.setTimeout("showTime()",1000);-->
window.setInterval("showTime()",1000);
//setTimeout("self.location.reload();",1000);
//setTimeout("showTime()",1000);
//3.实现显示功能
document.getElementById("time").innerHTML=formatTime;//document.getElementById("time").innerText=formatTime;
//把格式化了的时间放到body中编号id为time的div中,当body中onload属性调用showTime()方法实现以文本形式显示
//或者使函数带返回值:return time; 则在body中嵌入script代码实现显示
}
//带返回值,在body中嵌入script代码实现显示
function showTime1(){
return "本地时间:"+new Date().toLocaleString();
}
</script>
</head>
<!--如果不带返回值,则在body中用onload属性调用showTime()方法实现显示功能;如果带返回值,则在body中嵌入script代码实现显示:-->
<body onload = "showTime()">
<div id ="time" align="center" style="color:#3366FF"><span><span></div>
<div id="time1" align="center" style="background-color:#0033FF">
<script>
document.getElementById('time1').innerHTML=showTime1();
//每隔一秒执行一次document.getElementById('time1').innerHTML=showTime1();
setInterval("document.getElementById('time1').innerHTML=showTime1();",1000);
</script>
</div>
</body>
</html>