<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin:0; padding:0; } #div1{ width:100%; height:100vh; padding-top:100px; font-size:50px; background:#333; color:#fff; } </style> </head> <body> <div id="div1"> 北京时间:<br/> <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="img/0.png"> </div> </body> <script> move(); function move(){ var oDate=new Date(); oHour=toDou(oDate.getHours())+''; oMin=toDou(oDate.getMinutes()); oSen=toDou(oDate.getSeconds()); var oImg=div1.getElementsByTagName('img'); for(var i=0;i<oImg.length;i++){ oTimer=oHour+oMin+oSen; oImg[i].src='img/'+oTimer.charAt(i)+'.png'; } } setInterval(move,1000); function toDou(Num){ return (Num<10)?'0'+Num:Num; } </script> </html>
纯js实现动态时间显示
猜你喜欢
转载自blog.csdn.net/sunjynyue/article/details/83023244
今日推荐
周排行