js代码编写新年倒计时

最新推荐文章于 2023-01-15 17:07:17 发布

原创最新推荐文章于 2023-01-15 17:07:17 发布 · 3.9k 阅读

14 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

用js代码编写新年倒计时

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    window.onload = function () {//加载

        var child = document.querySelector(".child");//用选择器获取函数
        var date = new Date("2021-02-11");//新年时间
        var futureTime = date.getTime();//获取新年时间的毫秒数
        var xin = setInterval(function () {//定时器
            var today = new Date();//当前时间
            var todayTime = today.getTime();
            var cha = futureTime - todayTime;//时间差
            var sec = parseInt(cha / 1000 % 60);
            var min = parseInt(cha / 1000 / 60 % 60);
            var hour = parseInt(cha / 1000 / 60 / 60 % 24);
            var day = parseInt(cha / 1000 / 60 / 60 / 24);//一天24小时，一小时60分钟，一分钟60秒，一秒1000毫秒
            child.innerHTML = `距离新年还有${day}天${hour}小时${min}分钟${sec}秒`;//用` `符号，不是' ';

        }, 1000);

    }
</script>
<!--1. 新年倒计时-->
<div class="box">
    <h1>新年倒计时</h1>
<div class="child"></div>
</div>


</body>
</html>