JavaScript双11倒计时小案例

时间：2023-7-5 18:08 作者：吾峰 分类： 前端开发

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="box"></div>
    <script>

        var targetDate = new Date("2023/11/11")

        function diffTime(current, target){
            var sub = Math.ceil((target - current)/1000)

            var day = parseInt(sub/(60*60*24))
            var hours = parseInt(sub%(60*60*24) / (60*60))
            var minutes = parseInt(sub%(60*60)/60)
            var seconds = sub%60

            var obj = {
                day:day,
                hours:hours,
                minutes:minutes,
                seconds:seconds
            }
            return obj
        }

        // var res = diffTime(currentDate,targetDate)
        // console.log(res)

        setInterval(function(){
            var currentDate = new Date()
            var res = diffTime(currentDate, targetDate)
            // document.write(`双11${res.day}天${res.hous}时${res.minutes}分${res.seconds}秒`)
            // document.write("<br>")
            box.innerHTML = `距离双11还有${res.day}天${res.hous}时${res.minutes}分${res.seconds}秒`
        },1000)
    </script>
</body>
</html>

扫描二维码，在手机上阅读