Web前端面试题-实现今年倒计时功能

最新推荐文章于 2024-05-14 13:31:51 发布

智学无忧-老曹

最新推荐文章于 2024-05-14 13:31:51 发布

阅读量3.9k

点赞数 5

分类专栏： Web前端文章标签： Web前端面试题 JavaScript面试题 JavaScript倒计时 JavaScript计时器 JavaScript面试真题

本文链接：https://blog.csdn.net/lxcao/article/details/60326503

版权

Web前端专栏收录该内容

86 篇文章 48 订阅

订阅专栏

在网页中实现一个计算当年还剩多少时间的倒数计时程序 , 要求网页上实时动态显示” XX 年还剩XX天XX时XX分XX秒 ”

    <!DOCTYPEHTML>
<html>
    <head>
        <meta http-equiv=”Content-Type”content=”text/html;charset=UTF-8”>
        <title>倒计时</title>
    </head>
    <body>
      <input type=”text” value=”” id=”input”size=”500”>
    </body>
</html>

最终的效果如下

参考答案如下：

<script>
    //年还剩
    var txt= document.getElementById("input");
    setInterval(function () {
        //获取系统当前时间
        var now = new Date();
        //实例化今年跨年时间
        var targDate = new Date(now.getFullYear() + 1, 0, 1);
        //跨年时间与此时此刻时间差（毫秒）
        var long = targDate - now;
        var leftDay = parseInt(long/ 1000 / 60 / 60 / 24);
        long = long % (1000 * 60 * 60 * 24);
        var leftHour =parseInt(long / 1000 / 60 / 60);
        long = long % (1000 * 60 * 60);
        var leftMinute = parseInt(long / 1000 / 60) ;
        long = long % (1000 * 60 );
        var leftSeconde = parseInt(long / 1000);
        txt.value= now.getFullYear() +"年还剩" + leftDay
                + "天" +leftHour + "时"+leftMinute+"分"+leftSeconde+"秒";
    }, 1000);

</script>

智学无忧-老曹

关注

5
点赞
踩
12

收藏

觉得还不错? 一键收藏
打赏
1
评论
Web前端面试题-实现今年倒计时功能

在网页中实现一个计算当年还剩多少时间的倒数计时程序,要求网页上实时动态显示”XX年还剩XX天XX时XX分XX秒” 倒计时最终的效果如下实现代码如下：参考答案如下： //年还剩 var txt= document.getElementById("
复制链接

扫一扫