js倒计时

网上找了一些关于倒计时的例子。。

发现基本上都是这样的

d = Math.floor(leftTime/1000/60/60/24);  
h = Math.floor(leftTime/1000/60/60%24);  
m = Math.floor(leftTime/1000/60%60);  
s = Math.floor(leftTime/1000%60);   

 

我昨天写了一个比较有意思的例子

显示结果也完全没有问题

运行结果:

代码如下;

代码随便写的,优化美观方面没有考虑。

        <script>
            let aTime = (new Date('2018/03/9 00:00:00')).getTime();
            function times(data){
                let time = new Date(data);
                let Y = time.getFullYear()==1970?0:time.getFullYear()-1970;
                let M = time.getMonth()<10?0+(time.getMonth()):time.getMonth();
                let d = time.getUTCDate()-1;
                let H = time.getUTCHours();
                let m = time.getMinutes();
                let s = time.getSeconds();
                return [Y,M,d,H,m,s]
            }
            
            setInterval(() => {
                let tadayTime = (new Date()).getTime();
                let difference = (aTime - tadayTime);
                let [Y,M,d,H,m,s] = times(difference);
                document.getElementById('time').innerHTML = `${Y}年${M}月${d}日${H}时${m}分${s}秒`;
            }, 1000);
         
        </script>
    </head>
    <body>
        <p>倒计时:</p>
        <p id="time"></p>
    </body>

 

转载于:https://www.cnblogs.com/webPang/p/8527280.html

js:运用JavaScript写一个倒计时模版 今天更新了定时器倒计时方面的知识,希望大家多多支持! 阅读详情

相关推荐

JavaScript 实现倒计时电子钟附带小球滚动效果(canvas+js)

JavaScript 实现倒计时电子钟附带小球滚动效果............

酶泽的博客 1581

根据截至日期格式获取倒计时&&时间戳转日期格式

//时间戳转日期格式,传入时间戳必须为数字类型function currentDate(shijianchuo) { var date = new Date(shijianchuo); var y = date.getFullYear(); var m = date.getMonth() + 1; // m = m < 10 ? ('0' + m) : m; v...

weixin_30444105的博客 316

【倒计时】用JS写出京东倒计时效果

用JS写出倒计时效果

XiuBi_251的博客 1739

js时间之间的计算

自己写的时间 如:var startTime= ‘2019/12/06 19:00:00’; 只有这样 new Date(startTime).getTime() 才能把自己写的时间转化成毫秒数来进行加减乘除 毫秒数 利用Math.floor方法进行获取部分的时间 d=Math.floor(lefttime/1000/60/60/24); //天 h=Math.floor(lefttime/...

weixin_43281120的博客 479

多目标跟踪(MOT)中的卡尔曼滤波(Kalman filter)和匈牙利(Hungarian)算法详解

多目标跟踪(MOT)中的卡尔曼滤波(Kalman filter)和匈牙利(Hungarian)算法详解 1. 概览 在开始具体讨论卡尔曼滤波和匈牙利算法之前,首先我们来看一下基于检测的目标跟踪算法的大致流程。 2. 卡尔曼滤波(Kalman filter) 目标跟踪中使用的就是最基础的 Kalman filter 算法。这里也仅仅讨论最基础的 Kalman filter 算法。 卡尔曼滤波算法的过程很简单,如下图所示。最核心的两个步骤就是预测和更新(下图的 correct)。 在目标跟踪任务中,目标的

生命在于折腾! 2万+

手把手带你搞懂电压跌落测试DIP

砖一用4分钟时间手把手带你搞懂电压跌落测试DIP,希望对你有用~

qq_45508321的博客 7918

javaScript实现倒计时功能

目录一、主要思路二、css样式三、html代码四、js内容五、完整代码展示六、效果展示1.通过内置时间函数实例化日期对象获取当前时间 new Date。2.因为时间无法减去时间,有可能生成负数,所以采用时间戳的方法得到毫秒数形式的剩余时间,然后再把剩余时间转换为天、时、分、秒格式。3.最后把所获得的内容赋值给定义的变量。主要为了内容在页面展示美观,稍微美化一下。 三、html代码 定义一个默认格式为JavaScript引入定义变量。 四、js内容 1.首先获取html里面的spans里的全部标签

qq_65715980的博客 1万+

MDB协议中设备级别和选项(Levels and Options)

MDB协议的LEVEL级别介绍

hbstart的博客 939

JavaScript 逼真图片倒计时实现代码 js时间图片倒计时

JavaScript 逼真图片倒计时实现代码 js时间图片倒计时 效果图: <!doctype html> <html> <head> <meta charset="utf-8"> <head> <title>逼真图片倒计时</title> <style type="...

1万+

get_seed协议

【代码】get_seed协议。

a545958498的博客 911

【Jlink & C#】通过C#实现Jlink RTT上位机的功能

某天看到安富莱家的自己开发的调试器可以实现输出中文调试信息到自己编写的Jlink RTT上位机上,觉得无比神奇,略好奇到底是如何做的,找了很久,发现其上位机的对应的实现好像也没有完全开源出来。后来经过很多搜索确认,知道了几个事实:那么有没有可能用C#来控制Jlink呢?答案是,有!!! 解决思路在于,C#调用JLinkARM.dll里面的函数 这里转载下我认为很有意义的发现结合以上的几个发现,加上我自己的测试,我把我对接JLinkARM.dll的C#接口分享出来,不保证都能用,我只是测试了几个常用的功能,R

一只爱做笔记的码农 9147

java js倒计时_如何使用JavaScript实现倒计时

如何使用JavaScript实现倒计时//LiveClock1.innerHTML = "现在"+symbol+"天"LiveClock1.innerHTML = "setTimeout("DigitalTime1()",1000)}if (day<0 & day_2>19) //某某运动会结束{//LiveClock1.innerHTML = "现在离"+symbol+"还有...

weixin_28922227的博客 195

基于TENG的呼吸测量与识别系统:从蓝牙到WiFi的改造与上位机实现

本文介绍了一种基于摩擦纳米发电机(TENG)的呼吸测量系统改造方案,将原有蓝牙通信升级为WiFi传输。系统通过TENG传感器采集呼吸信号,STM32微控制器处理数据后,经ESP8266 WiFi模块发送至上位机。文中详细阐述了硬件改造(四通道改单通道、蓝牙换WiFi)、嵌入式软件修改(包括ESP8266驱动、数据采集与TCP通信实现)以及上位机软件设计。改造后的系统提升了传输距离和稳定性,为可穿戴健康监测提供了更优解决方案。

huanghm88的专栏 110

[JavaScript]js实现倒计时

<body> <time></time> <script> function isDate() { var time = document.getElementsByTagName("time")[0]; var date = new Date(); var year = date.getFullYear();//获取现在的时间

DaftJayee的博客 427

SWC_RTE01-AutoSAR架构【AutoSAR架构设计概述】

1 基于AutoSAR架构的概述 1.1架构层面:功能可以细分子功能,各个子功能需要交互。 -大功能可以通过Autosar组件Composition去表示; -各个子功能一般具有不可分割性,可以通过Autosar原子组件Component去表示; -各个子功能的交互可以通过接口去通信和交互; -各个子功能的行为可以通过内部行为去表示;具体表现为Runnable的设计;架构设计的时候不考虑具体的逻辑实现;只会关注Ruannble的触发事件或周期;数据访问的一致性问题;具体逻辑设计可通过模版c文件实现或通过基于

8451

【PyTorch项目实战】图像分类与识别:手写数字识别(MNIST)、普适物体识别(CIFAR-10)

主要介绍了两个经典的实战项目:(1)基于 MNIST 数据集的手写数字识别(2)基于 CIFAR-10 数据集进行图像分类

📷 图像处理践行者 | 传统算法 · 深度学习 · 多模态 | 分享实战经验与技术洞见,探索从像素到智能的无限可能。 4401

利用JavaScript实现倒计时

利用JavaScript实现倒计时 利用JS中的Date对象即可实现,创建目标时间和当前时间,利用getTime函数将两个时间转换成距离1970-01-01的秒数,相减后转化为年月日即可 利用JS中的Date对象即可实现 js代码 <script> window.onload = function() { setInterval(function() { var nowTime = new Date();//获取当前时间

Mengyu的博客 5994

霍尼韦尔SoftMaster使用说明

霍尼韦尔SoftMaster使用说明

html加js倒计时代码,分享最简单的JavaScript倒计时代码(附完整代码)

工作中经常需要在页面中设置倒计时,那你知道JS倒计时代码怎么写吗?这篇文章就给大家分享一个最简单的JS倒计时代码,以及详细的倒计时JS代码的思路,,有一定的参考价值,感兴趣的朋友可以看看。举例:设定一个截止日期,显示剩余时间。比如双十一马上来了,商家搞活动,可以用JS倒计时显示距离活动结束还有多久。具体代码如下:HTML部分:给四个 标签,用于显示剩余的天数,小时,分钟和秒JavaScript部分...

weixin_39642761的博客 918

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

js倒计时(格式为某天某时某分某秒)

倒计时,js的,除了jq脚本其他不需要引入 格式为 1天1时1分1秒 就可以实现倒计时 html: <span id="timebox">1天12时12分12秒</span> js: <script type="text/javascript"> $(function () { var tid = setInterval(funct...

苏程宽的博客 1685

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

JS新年倒计时

JS新年倒计时

不迁怒,不贰过。小知识,大智慧。 1万+

JS倒计时

JS倒计时 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <ul class="t

强者惜字如金,弱者废话连篇! 170

js页面倒计时7天 java_JavaScript页面倒计时功能完整示例

本文实例讲述了JavaScript页面倒计时功能。分享给大家供大家参考,具体如下:效果图:源码:www.jb51.net JS倒计时h3{text-align:center;line-height:50px;height:50px;margin-top:100px;}#timer{text-align:center;}倒计时00:00:00var timeObj=document.getEleme...

weixin_39620065的博客 213

js写一个倒计时的红绿灯

html代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>红绿灯...

ai_169的博客 5500

html js秒杀倒计时,JavaScript仿京东秒杀倒计时代码实例

本篇文章小编给大家分享一下JavaScript仿京东秒杀倒计时代码实例,小编觉得挺不错的,现在分享给大家供大家参考,有需要的小伙伴们可以来看看。仿京东秒杀倒计时html代码秒杀倒计时::css样式代码*{margin: 0;padding: 0;}#box{width: 200px;height:300px;margin: 200px 200px;background: red;position:...

weixin_32160507的博客 1244
上一篇: angular4 数据绑定
下一篇: cookie、 sessionStorage 、localStorage之间的区别和使用
VB2016
博客等级 码龄10年 0粉丝 0原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符  | 博主筛选后可见
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值