首先新建一个文件夹，里面有0-9十张图片，
思路及注意点：
1.获取系统时间
Date对象
getHours，getMinutes，getSeconds
2.显示系统时间
字符串连接
空位补零
3.设置图片路径
charAt方法
代码如下：
<style>
*{font-size: 40px;color: yellow;background: red;}
</style>
<img src="images/0.png">
<img src="images/0.png">
时
<img src="images/0.png">
<img src="images/0.png">
分
<img src="images/0.png">
<img src="images/0.png">
秒
<script>
function toDouble(num){ //定义函数，空位补零
if(num<10){
return '0'+num;
}else {
return ''+num;
}
}
window.onload=function () {
function show(){
var i=0;
var oData=new Date(); //获取当前时间
var oBtn1=document.getElementById('btn1');
var oImg=document.getElementsByTagName("img");
var str=''+toDouble(oData.getHours())+toDouble(oData.getMinutes())+toDouble(oData.getSeconds()); //前面加'',是为了变成字符串链接，而不是纯数字进行数学相加
// alert(str);
for (var i = 0; i < oImg.length; i++) {
oImg[i].src='images/'+str.charAt(i)+'.png' //charAt() 是指在第几个位置上的字符，比如charAt(0)只在第一个位置上的字符
};
}
setInterval(show,1000); //设置定时器，没1秒执行一次show函数
show() //默认刷新就执行
}
