倒计时案件

最新推荐文章于 2024-08-04 16:33:59 发布

程序员阿登

最新推荐文章于 2024-08-04 16:33:59 发布

阅读量43

点赞数

分类专栏： js 文章标签： javascript html css

本文链接：https://blog.csdn.net/m0_73605639/article/details/129172628

版权

js 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Title</title>
    <style>
        div {
            margin: 200px;
        }
 
        span {
            display: inline-block;
            width: 40px;
            height: 40px;
            background-color: #333;
            font-size: 20px;
            color: #fff;
            text-align: center;
            line-height: 40px;
        }
    </style>
</head>
<body>
<div>
    <span class="hour">1</span>
    <span class="minute">2</span>
    <span class="second">3</span>
</div>
<script>
    var hour = document.querySelector('.hour')
    var minute = document.querySelector('.minute')
    var second = document.querySelector('.second')
    var b = +new Date('2023-2-23 2:00:00');
    x()//调用函数，防止刷新时页面有空白
    setInterval(x,1000)
 
        function x () {
        var a = +new Date();
        var z = (b - a) / 1000;
        var h = parseInt(z / 60 / 60 );//去掉除24，不然无法显示超过24小时的时间
        h = h > 10 ? h : '0' + h;
        hour.innerHTML = h;
        var m =parseInt(z / 60 % 60);
        m = m > 10 ? m : '0' + m;
        minute.innerHTML = m;
        var s = parseInt( z   %  60 );
        s = s > 10 ? s : '0' + s;
        second.innerHTML = s;
    }
 
 
</script>
</body>
</html>