目录
一、基本思路
创建time()函数，利用JavaScript中已有对象date对象的属性及方法获取时间，最后利用document对象实现页面上的时间显示。
二、代码
第一步：创建时间函数，利用date对象获得相应时间值
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>timer</title>
</head>
<body οnlοad="time()">
<script>
function time(){
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;//因为month属性从0开始所以加1
var day = date.getDate();
var week = date.getDay();
var hour = date.getHours();
var minute = date.getMinutes();
var second = date.getSeconds();
second = second<10?"0"+second:second;
var current = year+"-"+month+"-"+day+" "+"星期"+week+" "+hour+":"+minute+":"+second;
document.getElementById("time").innerHTML=current;
}
setInterval("time()",1000);//每隔1000毫秒（即1秒）显示一次当前时间
</script>
<span id="time"></span>
</body>
</html>
运行结果：
第二步：完善，调整星期的显示格式，数字小于十时用零占位。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body οnlοad="time()">
<script>
function time(){
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
month = month<10?"0"+month:month;
var day = date.getDate();
day = day<10?"0"+day:day;
var week = "日一二三四五六".charAt(date.getDay());//使用charAt函数提取相应汉字
var hour = date.getHours();
hour = hour<10?"0"+hour:hour;//用三目运算符调整数字显示格式
var minute = date.getMinutes();
minute = minute<10?"0"+minute:minute;
var second = date.getSeconds();
second = second<10?"0"+second:second;
var current = year+"-"+month+"-"+day+" "+"星期"+week+" "+hour+":"+minute+":"+second;
document.getElementById("time").innerHTML=current;
}
setInterval("time()",1000);
</script>
<span id="time"></span>
</body>
</html>
运行结果：
