博客列表 >0121 【jQuery急速入门】春节倒计时练习/js date函数的使用 / 时间戳转换为日期

0121 【jQuery急速入门】春节倒计时练习/js date函数的使用 / 时间戳转换为日期

小包子的博客
小包子的博客原创
2019年02月08日 21:43:33688浏览

总结:

本课主要学习jQuery的入门知识:引用方式,ready()状态,$+选择器。作业主要练习了JS的date函数和时间戳转换为日期。

实例

<!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>01-春节倒计时</title>
</head>
<body>
    <div class="wrap">
        <p>距离2019年3月1日倒计时:<span id="text"></span></p>
    </div>
    <script>
    // 1、获取今天的时间戳
    // 2、获取春节的时间戳
    // 3、将差值转换为日期

    // 剩余秒数
    var timeTo = setInterval(function(){
        var today = new Date().getTime();
        var endDay = new Date('2019-03-01 00:00:00').getTime();
        var s = endDay - today;

        var rd = Math.floor(s / 1000 );
        var dd = Math.floor(rd / 86400);
        var hh = Math.floor(rd % 86400 / 3600);
        var mm = Math.floor(rd % 3600 / 60);
        var ss = Math.floor(rd % 60 );

        var span = document.querySelector('#text');
        span.innerHTML = dd+'天'+hh+'小时'+mm+'分'+ss+'秒'

    },1000)
    </script>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议