<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <style type="text/css"> body{ background: url(img/0.png); } </style> <script> //如果小于10 的话,前面补0 时钟的格式01:12:30 function toDou(n){ if(n<10) { return "0"+n; }else{ return ""+n;//为什么要加空 因为证明返回的是一个字符串 } } window.onload = function(){ var imgArr = document.getElementsByTagName("img"); function tick(){ var oDate =new Date(); var str =toDou( oDate.getHours() )+toDou( oDate.getMinutes() )+toDou( oDate.getSeconds() ); for(var i = 0 ; i < imgArr.length;i++) { //imgArr[i].src = 'img/'+str[i]+'.png';//不兼容ie7以下版本
imgArr[i].src = 'img/'+str.charAt(i)+‘.png'; } } setInterval(tick,1000);//每隔一秒调用一次 tick();//当加载完成的时候调用一次 就不会是刷新的时候为初始值了 00:00:00 } </script> <body style="background: black; color: white; font-size: 50px;"> <img src="img/0.png" alt="" /> <img src="img/0.png" alt="" /> : <img src="img/0.png" alt="" /> <img src="img/0.png" alt="" /> : <img src="img/0.png" alt="" /> <img src="img/0.png" alt="" /> </body> </html>