效果图：
程序代码：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>选项卡</title> <style> </style> <script> window.onload=function () { function toDouble(num) { if (num<10){ return '0'+num; } else { return ''+num; } } var oBtn=document.getElementById('btn'); var Img=document.getElementsByTagName('img'); function update() { var oDate=new Date(); var str=toDouble(oDate.getHours())+toDouble(oDate.getMinutes())+toDouble(oDate.getSeconds()); for (i=0;i<Img.length;i++){ Img[i].src='../IMG/'+str.charAt(i)+'.png'; } } setInterval(update, 1000);//并非你开了这个定时器以后，就直接执行，而是需要先过1000毫秒，下面一行代码解决 //先开启定时器以后手动的执行函数，就可以解决这个问题； update(); } </script> </head> <body style="background: #990099;color: #ffff00;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>