zoukankan      html  css  js  c++  java
  • JS 倒计时效果

    今天给表弟逛网上商城看笔记本电脑时,看见有一些显示倒计时的效果,觉得蛮好的,特别去查了下,今天给大家分享下倒计时的制作,如有缺漏请大家指出。

    倒计时算法我想大家都不陌生,数学公式如下:‘’倒计时=截止时间 - 现在时间‘’。好比我们在当天6点设置一闹钟在当天12点响,这中间相差的时间就是倒计时(12-6=6)小时

    但不单单是这样的计算,毕竟有可能存在这种情况:截止时间(2019-8-17   3:20:10),现在时间(2019-8-16 15:35:20),这中间时分秒相减会为负数,所以一般我们会换成统一单位再进行相减,再换回去。

    时间换算进制:

    一天=24小时=(24*60)分=(24*60*60)秒

    所以我们用时间戳来做,详细公式是:剩余时间毫秒数(倒计时)=截止时间毫秒数 - 现在时间毫秒数。

    首先我们先了解怎么获取当前时间的时间戳,有以下几种方法,大家挑着用

    <script>
    var date=new Date();//获取当前时间

    console.log(date.valueOf());
    console.log(date.getTime());
    console.log(+date);//等价于var date= +new  Date();最常用的
    console.log(Number(date));
    console.log(Date.now());//H5新增


    </script>

    接着就是时间戳毫秒数转换成特定的天,时,分,秒

    <script>

    d=parseInt(总秒数/60/60/24);//计算天数
    h=parseInt(总秒数/60/60%24);//计算小时
    m=parseInt(总秒数/60%60);//计算分数
    s=parseInt(总秒数%60);//计算当前秒数


    </script>

    最后就是就是倒计时效果的实现

    <script>

    function conutDown(time){
          var nowTime = +new Date();//返回当前时间总的毫秒数
          var stopTime=+new Date(time);//返回的是截止时间总的毫秒数
         

          //times是剩余时间总的秒数
          var times=(stopTime - nowTime) / 1000;

           
           var d=parseInt(times / 60 /60 /24);//天
           var h=parseInt(times / 60 /60 %24);//时
           var m=parseInt(times / 60 % 60);//分
           var s=parseInt(times % 60 ); //秒
           
           
           return d+'天'+h+'时'+m+'分'+s+'秒';
         }
        console.log(conutDown('2019-8-17 12:00:00'));//截止时间自己修改哈



    </script>
  • 相关阅读:
    python学习笔记(十三)接口开发
    python学习笔记(十二)python操作redis
    python学习笔记(十一)redis的介绍及安装
    python学习笔记(十)完善数据库操作
    python学习笔记(九)函数返回多个值,列表生成式,循环多个变量,入参格式声明
    Jenkins+Ant+Jmeter自动化测试平台
    python学习笔记(八)python操作Excel
    python学习笔记(七)操作mysql
    python学习笔记(六)time、datetime、hashlib模块
    smtplib与email模块(实现邮件的发送)
  • 原文地址:https://www.cnblogs.com/smile-xin/p/11364166.html
Copyright © 2011-2022 走看看