<body>
<img src="images/0.png" alt="" id="h1" />
<img src="images/0.png" alt="" id="h2"/>
<img src="images/second1.png" alt="" />
<img src="images/0.png" alt="" id="m1"/>
<img src="images/0.png" alt="" id="m2"/>
<img src="images/second1.png" alt="" />
<img src="images/0.png" alt="" id="s1"/>
<img src="images/0.png" alt="" id="s2"/>
<script type="text/javascript">
//获取图片
var oH1=document.getElementById('h1');
var oH2=document.getElementById('h2');
var oM1=document.getElementById('m1');
var oM2=document.getElementById('m2');
var oS1=document.getElementById('s1');
var oS2=document.getElementById('s2');
getTime();
function getTime(){
//获取系统时间
var date=new Date();
var h=date.getHours();
var m=date.getMinutes();
var s=date.getSeconds();
//加零
h=setNum(h);
m=setNum(m);
s=setNum(s);
//双位数变成单位数(这里的意思是每一个图片代表一个数字不能代替两个数字，因此要把得到的两位数变成一位数)
h1=h%10;
h2=parseInt(h/10);
m1=m%10;
m2=parseInt(m/10);
s1=s%10;
s2=parseInt(s/10);
//获取图片地址
oH1.src='images/'+h2+'.png';
oH2.src='images/'+h1+'.png';
oM1.src='images/'+m2+'.png';
oM2.src='images/'+m1+'.png';
oS1.src='images/'+s2+'.png';
oS2.src='images/'+s1+'.png';
setTimeout(getTime,1000);
}
function setNum(num){
if(num<10){
num="0"+num;
}
return num;
}
</script>
</body>见下图：
