栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Java

JavaScript-----页面显示倒计时

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

JavaScript-----页面显示倒计时

目录

一、倒计时效果

       1.核心算法

       2.用时间戳来做

二、转换公式

三、主要代码

四、效果展示


一、倒计时效果

       1.核心算法

        输入的时间减去现在的时间就是剩余的时间(剩余时间毫秒数 转换为 剩余时间的 年月日时分秒),即倒计时 。但是,不能拿着时分秒相减,比如 05 分减去25分,结果会是负数的。

       2.用时间戳来做

       用户输入时间总的毫秒数减去现在时间的总的毫秒数,得到的就是剩余时间的毫秒数。

       比如 将来时间戳 2000ms - 现在的时间戳 10000ms = 10000ms。1000ms转换为就是0小时0分1秒。

        获取时间戳有三种方法 geiTime()       简写 +new Date()       Date.now()

       3.把剩余时间总的毫秒数转换为天、时、分、秒 (时间戳转换为时分秒)

二、转换公式

如下:

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

    var nowTime = new Date();//获取当前系统时间
    var endTime = new Date('2022-6-26');//定义结束的时间
    var time = endTime.getTime() - nowTime.getTime();//距离结束时间的毫秒数
    console.log(time);
    var day = Math.floor(time/(1000*60*60*24));//计算天数
    console.log(day);
    var hour = Math.floor(time/(1000*60*60)%24);//计算小时
    console.log(hour);
    var minute = Math.floor(time/(1000*60)%60) //计算分钟
    console.log(minute);
    var seconds = Math.floor(time/1000%60) //计算秒数
    console.log(seconds);

效果显示 :

三、主要代码


	
		
		
	
	
		
		
		
		
		
	

四、效果展示

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/995139.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号