<html>
<head>
<script type="text/javascript">
function startTime()//函数startTime, 功能：显示当前时间
{ var today=new Date()//声明一个时间对象
var h=today.getHours()//获取当前小时
var m=today.getMinutes()//获取当前分钟
var s=today.getSeconds()//获取当前秒数
// add a zero in front of numbers<10
m=checkTime(m)//调用checkTime函数，功能见下面
s=checkTime(s)//调用checkTime函数，功能见下面 document.getElementById('txt').innerHTML=h+":"+m+":"+s //在txt标签里输出时间 小时：分钟：秒
t=setTimeout('startTime()',500) //每隔500毫秒（0.5秒）刷新一次时间，为了实现时间动态显示效果
}
function checkTime(i)//checkTime函数，设置小于10的时间数字格式，例如5秒显示成05秒 {
if (i<9)
{i="0" + i}
return i
}
</script>
</head>
<body onload="startTime()"> //页面加载时调用startTime函数
<div id="txt"></div>//用来显示时间的标签
</body>
</html>
看上面的代码： Javascript中：小时钟t=setTimeout('startTime()',500)为什么隔500毫秒就刷新页面而不是每隔1000毫秒（即1秒）再刷新一次页面？ 原因： 这里的setTimeout是递归执行的。也就是在执行一次后，时间更新以后，才会设置下次的setTimeout，这里执行更新时间的代码也是要耗费时间的，因为javascript是脚本语言，又基于浏览器，性能比较差，而且更新时间是dome操作，比较慢。所以设置500能保证精度，避免延迟。 如果设置1000毫秒刷新页面，由于程序的执行还需要时间，所有刷新页面的时间必然大于1000毫秒=1秒，此时就有可能出现秒数不是依次增加1秒，例如：在开始执行程序时时间是12点30分30.9秒，而页面是精确到1秒，所有页面上显示的是12:30:30，如果设置1000毫秒（实际上是1.3秒）更新一次，则下次页面显示的时间是12点30分32秒（因为30.9+1.3=32.2）,直接跳过12点30分31秒，这样更新就不及时了，对吧？ 设置500毫秒更新一次页面是通常做法，但是也不能设置太小，刷新太频繁会造成浏览器负载的浪费。
网友评论