javescript第七天

最新推荐文章于 2022-03-10 13:12:21 发布

对饮江南雨

最新推荐文章于 2022-03-10 13:12:21 发布

阅读量76

点赞数

本文链接：https://blog.csdn.net/fiaank/article/details/111261892

版权

数字时钟
利用js的对象，和时间函数做一个不断变化的数字时钟
html样式

<body>
    <img src="img/1.JPG" alt="">
    <img src="img/1.JPG" alt="">
    <img src="img/colon.JPG" alt="">
    <img src="img/1.JPG" alt="">
    <img src="img/1.JPG" alt="">
    <img src="img/colon.JPG" alt="">
    <img src="img/1.JPG" alt="">
    <img src="img/1.JPG" alt="">
</body>

js样式

<script>
    var img = document.getElementsByTagName("img");
    showTime();

    function showTime() {
        var d = new Date();
        var h = d.getHours();
        var m = d.getMinutes();
        var s = d.getSeconds();

        h = h < 10 ? '0' + h : h;
        m = m < 10 ? '0' + m : m;
        s = s < 10 ? '0' + s : s;
        
        if (h < 10 || m < 10 || s < 10) {
            img[0].src = "img/0.JPG"
            img[3].src = "img/0.JPG"
            img[6].src = "img/0.JPG"
        }
        setTimeout(showTime, 1000);
        img[0].src = "img/" + Math.floor(h / 10) + ".JPG";
        img[1].src = "img/" + Math.floor(h % 10) + ".JPG";
        img[3].src = "img/" + Math.floor(m / 10) + ".JPG";
        img[4].src = "img/" + Math.floor(m % 10) + ".JPG";
        img[6].src = "img/" + Math.floor(s / 10) + ".JPG";
        img[7].src = "img/" + Math.floor(s % 10) + ".JPG";
        
    }
</script>

先获取img标签，写一个函数，定义四个变量，分别是现在时间new Date() 在分别获取时，分，秒。时，分，秒会存在第一位图片是0的情况，要判断。

对饮江南雨

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javescript第七天

数字时钟利用js的对象，和时间函数做一个不断变化的数字时钟html样式<body> <img src="img/1.JPG" alt=""> <img src="img/1.JPG" alt=""> <img src="img/colon.JPG" alt=""> <img src="img/1.JPG" alt=""> <img src="img/1.JPG" alt=""> &l
复制链接

扫一扫