定时器的使用：制作时钟

最新推荐文章于 2024-07-24 00:44:33 发布

浮生途

最新推荐文章于 2024-07-24 00:44:33 发布

阅读量745

点赞数

分类专栏： JavaScript web

本文链接：https://blog.csdn.net/jy123_123/article/details/89002452

版权

JavaScript 同时被 2 个专栏收录

18 篇文章 0 订阅

订阅专栏

web

10 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>            
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

    </style>
    <script>
        function toDou(n) {              //小于10的数字前加“0”      
            if (n<10){
               return "0"+n;
            }
            else  {
                return ""+n;            //n前面加“”，防止n是两位数时相加，确定返回值都是字符串
            }
        }
        window.onload=function (ev) {
            var aImg=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<aImg.length;i++) {
                        aImg[i].src="imAGS/"+str.charAt(i)+".png"
                    }
                }
//当刷新时，获取的时间无变化，正常跳转。
            setInterval(tick,1000);
            tick();




        }
    </script>

</head>
<body style="background: black;color: gainsboro;font-size: 60px" >
    <img src="imAGS/0.png" alt="">
    <img src="imAGS/0.png" alt="">
    :
    <img src="imAGS/0.png" alt="">
    <img src="imAGS/0.png" alt="">
    :
    <img src="imAGS/0.png" alt="">
    <img src="imAGS/0.png" alt="">
</body>
</html>