超炫酷数码时钟

<!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>

  

原文地址:https://www.cnblogs.com/mingjixiaohui/p/5266692.html