just4you

2007-05-04

备忘：显示时间的JS

关键字: 时间 javascript

无聊的五一做无聊的事。

<html>
<head>
<title> 显示年月日还有时间 </title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script>
function date(){
	//arguments JS自带的变量
	this.length = arguments.length;
	for(var  i= 0; i < this.length; i ++){
		this[i] = date.arguments[i];
	}
}

function displaytime(){	
	var d  = new Date();
	var h = d.getHours();
	var m = d.getMinutes();
	var s = d.getSeconds();
	//无聊，所以把时间分的细一点，看着比较专业：）
	//0-2 午夜 2-5 凌晨 5-9 早上 9-12 上午 12-14 中午 14-18 下午 18-24 晚上	
	var ampm = "上午";
	if (h >= 0 && h < 2) ampm = "午夜";
	if (h >= 2 && h < 5) ampm = "凌晨";
	if (h >= 5 && h < 9) ampm = "早上";
	if (h >= 9 && h < 12) ampm = "上午";
	if (h >= 12 && h < 14) ampm = "中午";
	if (h >= 14 && h < 18) ampm = "下午";
	if (h >= 18) ampm = "晚上";
	//12小时制
	if (h >12) h -= 12;
	//补0
	if (m < 10) m = "0" + m;
	//补0
	if (s < 10) s = "0" + s;
	var time = ampm + h + ":" + m + ":" + s;
	//年月日和星期
	var day  = new date("星期日","星期一","星期二","星期三","星期四","星期五","星期六");
	var ymd = d.getYear() + "年" + (d.getMonth() + 1) + "月" + d.getDate() + "日" +  day[d.getDay()];
	//取得显示位置
	var tiemarea = document.getElementById("timearea");
	timearea.innerHTML = ymd + "  "  + time;

	setTimeout("displaytime()",1000);
}
//setInterval("displaytime()",1000);
//上面的setInterval作用同setTimeout，使用setTimeout的话需要在body处onload="displaytime();"
//5.21修改：用setInterval的话，在页面下载完JS后便会执行，可此时<div id="timeare"/>还没有被载入，getElementById("timearea")会找不到对象，所以还是用setTimeout()和onload吧。
//在onload时调用setInterval()应该也可以，不过没有试用
</script>
<style type="text/css">
#timearea{
	font-size:14px;
	color:red;
	font-weight:bold;
}
</style>
</head>
<body onload="displaytime();">
<div id="timearea">time</div>
</body>
</html>