用js写京东秒杀倒计时

最新推荐文章于 2024-04-04 12:32:48 发布

诗霖雪

最新推荐文章于 2024-04-04 12:32:48 发布

阅读量589

点赞数 6

分类专栏： js案例文章标签： javascript 前端 css

本文链接：https://blog.csdn.net/m0_56713342/article/details/134470688

版权

js案例专栏收录该内容

14 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div {
            width: 190px;
            height: 260px;
            background: url(./4a15d8883775742e3efbb850ae14def7.png);
        }

        h2 {
            color: white;
            text-align: center;
            line-height: 100px;
            height: 100px;
            font-size: 30px;
            margin-bottom: 50px;
        }

        p {
            color: white;
        }

    span {
            display: inline-block;
            width: 40px;
            height: 40px;
            background-color: black;
            font-size: 30px;
        }

        p {
            text-align: center;
       

        }

   
        strong{
       
            line-height: 40px;
            font-weight: 900;
            font-size: 30px;
        }
        a{
            text-decoration: none;
            font-size: 20px;
            color: white;
            font-weight: 600;
        }
      
    </style>
</head>

<body>
    <div>
        <h2>京东秒杀</h2>
        <p><a href="">18:00</a>点场 距结束</p>
        <p><span class="hour"></span>
            <strong>:</strong>
             <span class="minute"></span>
             <strong>: </strong>
             <span class="second"></span></p>

    </div>
    <script>
        const clock = document.querySelector('.countdown.clock')
        const hour = document.querySelector('.hour')
        const minutes = document.querySelector('.minute')
        const second = document.querySelector('.second')
        let inputTime = +new Date('2023-11-18 18:00:00')
        countDown()
        setInterval(countDown, 1000)

        function countDown() {
            let nowTime = +new Date()
            let times = (inputTime - nowTime) / 1000
            let h = parseInt(times / 60 / 60 % 24);//时
            h = h < 10 ? '0' + h : h;
            hour.innerHTML = h;
            let m = parseInt(times / 60 % 60);//分
            m = m < 10 ? '0' + m : m;
            minutes.innerHTML = m;
            let s = parseInt(times % 60);//秒
            s = s < 10 ? '0' + s : s;
            second.innerHTML = s;

        }
    </script>
</body>

</html>