<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>时钟</title>
<script>
function set(obj){
if(obj<10){
return '0'+obj; }
else
return ''+obj;
}
window.onload=function(){ var aImg=document.getElementsByTagName('img');
function tick(){
var oDate=new Date();
var str=set(oDate.getHours())+set(oDate.getMinutes())+set(oDate.getSeconds()); for(var i=0;i<str.length;i++){
aImg[i].src='img/'+str[i]+'.png';
}
}
tick();
setInterval(tick
,1000); //alert(str);
};
</script>
</head>
<body style="background:red; color:red; font-size:50px">
<img src='img\0.png' / >
<img src='img\0.png' />
:
<img src='img\0.png' />
<img src='img\0.png' />
:
<img src='img\0.png' />
<img src='mg\0.png' />
</body>
</html>
定时器小应用+date对象。。。
关键在于字符串的处理。。。。
将date对象中获取的数字不会按字符串加在一起,自定义set函数将返回值全变为字符串并在个位数前补0.。。。。。
再处理每个img标签。。。配以炫酷的png/jpg图像,效果好的很。。。。