利用JS函数制作时钟运行程序-CSDN博客

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>时钟</title>
    <script type="text/javascript">
    function toDouble(num)//不满两位，空位补零
    {
        if(num<10)
        {
            return '0'+num;//一位数前面加零，就变为两位数
        }
        else
        {
            return ''+num;
        }
    }
    window.onload=function()//程序主体运行内容
    {
        var oBtn=document.getElementById('btn1');
        var aImg=document.getElementsByTagName('img');
        var i=0;
        function updateTime()
        {
            var oDate=new Date();//获取系统时间
                var str=toDouble(oDate.getHours())+toDouble(oDate.getMinutes())+toDouble(oDate.getSeconds());
                //alert(str);
            for(i=0;i<aImg.length;i++)
            {
                aImg[i].src='img/'+str.charAt(i)+'.png';//设置图片路径使用charAt方法
            }
        }
        setInterval(updateTime,1000);//自动跟随系统时间每秒刷新
        updateTime();//避免页面刷新时停留1秒钟等待时间
    };
    </script>
</head>
<body style="color:#FFFF00; background:#990099; font-size:30px;">
    <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/>
    <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/>
    点
    <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/>
    <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/>
    分
    <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/>
    <img src="C:\Users\Administrator\Desktop\练习文件\数码时钟\img\0.png"/>
    秒
</body>
</html>