使用JS获取两个时间差(JS写一个倒计时功能)
<body onload="myFunction()">
<p id="demo"></p>
<script>
function myFunction(){
var nowDate = new Date();
var EndDate=new Date("2020-10-01 10:30:00")
var dateDiff=EndDate.getTime()-nowDate.getTime();
var days=Math.floor(dateDiff/(24*3600*1000)) //计算出天数
//计算出小时数
var leave1=dateDiff%(24*3600*1000) //计算天数后剩余的毫秒数
var hours=Math.floor(leave1/(3600*1000))
//计算相差分钟数
var leave2=leave1%(3600*1000) //计算小时数后剩余的毫秒数
var minutes=Math.floor(leave2/(60*1000))
//计算相差秒数
var leave3=leave2%(60*1000) //计算分钟数后剩余的毫秒数
var seconds=Math.round(leave3/1000)
//调用checkTime方法将数字小于10的在前面补0
days=checkTime(days);
hours=checkTime(hours);
minutes=checkTime(minutes);
seconds=checkTime(seconds);
var x = document.getElementById("demo");
x.innerHTML="剩余时间:"+days+"天"+hours+"小时"+minutes+"分钟"+seconds+"秒";
t=setTimeout(function(){myFunction(),1000})
}
function checkTime(i){
if(i<10&&i!=0){
i="0"+i;
}
return i;
}
</script> </body>
思路:使用getTime()计算出两个时间的毫秒单位并相减得到以毫秒为单位的时间差,然后通过计算分别获取到对应的时分秒。
扩展:
Math.floor()方法执行的是向下取整计算,它返回的是小于或等于函数参数,并且与之最接近的整数。
Math.round() 方法可把一个数字四舍五入为最接近的整数。
使用JS获取两个时间差(JS写一个倒计时功能)的更多相关文章
- Vue3语法快速入门以及写一个倒计时组件
Vue3写一个倒计时组件 vue3 beta版本发布已有一段时间了,文档也大概看了一下,不过对于学一门技术,最好的方法还是实战,于是找了一个比较简单的组件用vue3来实现,参考的是vant的count ...
- js计算两个时间差 天 时 分 秒 毫秒
// 计算两个时间差 dateBegin 开始时间 function timeFn(dateBegin) { //如果时间格式是正确的,那下面这一步转化时间格式就可以不用了 var dateEnd = ...
- JS计算两个时间差的问题
计算两个时间差的问题 function getDateIsMatching(){ var pactbegindate=$("#loanbegindate").datetimebox ...
- js 获取两个日期相差的天数--自定义方法
//获取两个日期的相差天数 datedifference=function(sDate1, sDate2) { var dateSpan, tempDate, iDays; sDate1 = Date ...
- JS[获取两个日期中所有的月份]
//------[获取两个日期中所有的月份中] function getMonthBetween(start,end){ var result = []; var s = start.split(&q ...
- JS获取两个日期间的所有日期
var stime = '2018-07-25'; //开始日期 var etime = '2018-08-02'; //结束日期 getdiffdate(stime,etime); //获取两日期之 ...
- JS获取当前日期时间及JS日期格式化
Js获取当前日期时间: var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份( ...
- Vue.js 3.0搭配.NET Core写一个牛B的文件上传组件
在开发Web应用程序中,文件上传是经常用到的一个功能. 在Jquery时代,做上传功能,一般找jQuery插件就够了,很少有人去探究上传文件插件到底是怎么做的. 简单列一下我们要做的技术点和功能点 使 ...
- 使用node.js 文档里的方法写一个web服务器
刚刚看了node.js文档里的一个小例子,就是用 node.js 写一个web服务器的小例子 上代码 (*^▽^*) //helloworld.js// 使用node.js写一个服务器 const h ...
随机推荐
- 从苏宁电器到卡巴斯基第16篇:我在苏宁电器当营业员 VIII
其实不想走,其实很想留 我在之前的故事中说过,在大四的时候,我其实是想考研的,但是看了一段时间的书以后,发现自己实在不是那块料,主要是数学实在是学不明白,那么也就只能作罢了.而后来面试中石化的时候,尽 ...
- JDBC往数据库里插入数据
首先还是一个工具类 插入数据
- Java常见异常类型
在Java学习过程中,我们会碰到各种各样的异常,现将面试过程中遇到的常见异常做一罗列并举例: 1.NullPointerException: 空指针异常.菜鸟编程经验发现这个异常是经常会发生的,属于运 ...
- 浅谈自动特征构造工具Featuretools
简介 特征工程在机器学习中具有重要意义,但是通过手动创造特征是一个缓慢且艰巨的过程.Python的特征工程库featuretools可以帮助我们简化这一过程.Featuretools是执行自动化特征工 ...
- (10)MySQL进阶篇SQL优化(InnoDB锁-间隙锁)
1.概述 当我们用范围条件而不是相等条件检索数据,并请求共享或排他锁时,InnoDB会给符合条件的已有数据记录的索引项加锁:对于键值在条件范围内但并不存在的记录,叫做"间隙(GAP)&quo ...
- WPF使用自定义Main函数
一.自定义Main函数 在WPF中,我们添加一个Program静态类,添加一个Main静态方法,需要注意的是该方法需要添加"STAThread",表示WPF程序需运行在单一线程单元 ...
- Java匿名对象导致的内存泄漏
这几天与在某群与群友讨论了Runnable匿名对象导致内存泄漏的相关问题,特此记录一下. 示例代码如下: package com.memleak.memleakdemo; public class L ...
- [Java] Spring 使用
背景 JavaEE 应用框架 基于IOC和AOP的结构J2EE系统的框架 IOC(反转控制):即创建对象由以前的程序员自己new 构造方法来调用,变成了交由Spring创建对象,是Spring的基础 ...
- vmware快捷键大全
初学linux的朋友往往需要使用VMware这个软件 与其打交道多了 越来越觉得快捷键的重要性 特将搜集到的快捷键记录以便查阅记忆 Ctrl-Alt-Enter 进入全屏模式 ctrl+alt+ins ...
- Python socket 编程实验
实验内容 1.编写一个基于UDP协议的客户机与服务器程序,实现相互通讯. 2.编写一个基于TCP协议的客户机与服务器程序,实现相互通讯. 3.捕获以上两种通讯的数据包,使用Wireshark进行分析, ...