<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js时分秒毫秒倒计时</title>
</head>
<body>
<div>
<span id="_d">00</span>
<span id="_h">00</span>
<span id="_m">00</span>
<span id="_s">00</span>
<span id="_ms">00</span>
</div>
<script type="text/javascript">
function countTime() {
var date = new Date();
var now = date.getTime();
var endDate = new Date("2018-8-20 18:28:00");//设置截止时间
var end = endDate.getTime();
var leftTime = end - now; //时间差
var d, h, m, s, ms;
var timer;
if(leftTime >= 0) {
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);
ms = Math.floor(leftTime % 10);
if(ms < 10) {
ms = "0" + ms;
}
if(s < 10) {
s = "0" + s;
}
if(m < 10) {
m = "0" + m;
}
if(h < 10) {
h = "0" + h;
}
//将倒计时赋值到div中
document.getElementById("_d").innerHTML = d + "天";
document.getElementById("_h").innerHTML = h + "时";
document.getElementById("_m").innerHTML = m + "分";
document.getElementById("_s").innerHTML = s + "秒";
document.getElementById("_ms").innerHTML = ms + "毫秒";
//递归每秒调用countTime方法,显示动态时间效果
timer = setTimeout(countTime, 50);

} else {
console.log('已截止')
document.getElementById("_d").innerHTML ="00天";
document.getElementById("_h").innerHTML ="00时";
document.getElementById("_m").innerHTML ="00分";
document.getElementById("_s").innerHTML ="00秒";
document.getElementById("_ms").innerHTML = "00毫秒";
}

}

countTime();
</script>
</body>
</html>

JS倒计时-毫秒的更多相关文章

  1. js 倒计时毫秒级别显示

    <html> <head> <style> div{ width:100%; text-align:center; font-size: 14px; } </ ...

  2. js倒计时-倒计输入的时间

    计算指定时间到指定时间之间相差多少天.时.分.秒. 节日.活动.商城常用. 原理: 主要使用到时间戳,也就是从1970 年 1 月 1 日 到指定时间的毫秒数. 1. 求出毫秒差 :当两个时间直接进行 ...

  3. js 倒计时(可自定义时间)

    <html> <head> <title>js 倒计时</title> </head> <body> <div> & ...

  4. js倒计时显示

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>j ...

  5. Js倒计时程序

    Js倒计时程序 点击下载

  6. 用js完成毫秒格式数据的日期格式化任务

    后台传过来的数据  creationTime  在后台是Date类型的 毫秒转换成  05-24  月 日格式的 //获得月日得到日期oTime function getMoth(str){ var  ...

  7. JS倒计时网页自动跳转代码

    <title>JS倒计时网页自动跳转代码</title> <script language="JavaScript" type="text/ ...

  8. JS倒计时 代码

    JS倒计时 代码 <div> <span id="KSD">3</span>天 <span id="KSH">1 ...

  9. js倒计时函数和(js禁用和恢复a标签的操作)

    <script type="text/javascript"> /*获取手机号*/ var start_time=60; function get_phone_nums ...

随机推荐

  1. eclipse中启动tomcat之后,项目一直重复部署导致内存报警!!!

    项目环境:jdk1.8+tomcat8.0; 出现该问题的原因:目前还没有确定,网友有很多的说法. 但是我在部署其中一个项目时出现此情况,在同样的环境下部署另外一个项目未出现此情况. 其中的一种解决方 ...

  2. BZOJ2741:[FOTILE模拟赛]L

    Description FOTILE得到了一个长为N的序列A,为了拯救地球,他希望知道某些区间内的最大的连续XOR和. 即对于一个询问,你需要求出max(Ai xor Ai+1 xor Ai+2 .. ...

  3. CF148D Bag of mice (期望dp)

    传送门 # 解题思路 ​    ~~这怕是本蒟蒻第一个独立做出来的期望$dp$的题,发篇题解庆祝一下~~.首先,应该是能比较自然的想出状态设计$f[i][j][0/1]$ 表示当前还剩 $i$个白老鼠 ...

  4. mysql联表查询,使用phpStudy自带的

    一.内联结.外联结.左联结.右联结的含义及区别在SQL标准中规划的(Join)联结大致分为下面四种:1.内联结:将两个表中存在联结关系的字段符合联结关系的那些记录形成记录集的联结.2.外联结:分为外左 ...

  5. lumen框架使用Elasticsearch详解

    该博文是集合几个博客踩坑得来的,百度热搜前几篇都是缺胳膊少腿的,所以结合几篇博客实现了一遍. 一.lumen使用Elasticsearch 首先需要搭建好的elasticsearch环境: http: ...

  6. Eclipse Java开发环境的搭建

    (2019年2月19日注:这篇文章原先发在自己github那边的博客,时间是2016年9月6日) 工作室的老人家们和小朋友们组成了一个Java开发学习团队,想起之前在暑假项目中学过一点Java基础知识 ...

  7. To Learn more

    Openssl Heartbleed Html5 +ajax+ openlayers+qunee+google maps darkleech

  8. PAT甲级——A1004 Counting Leaves

    A family hierarchy is usually presented by a pedigree tree. Your job is to count those family member ...

  9. Python学习day12-函数基础(2)

    <!doctype html>day12博客 figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { pos ...

  10. springboot自己实现mysql主从数据切换机制

    在很多公司都是实现了数据的读写分离,所谓的读写分离,就是写的时候从主库 ,然后从库就会从主库中复制过去,这样就会形成了数据的读写分离,然而在很多场景是适用的,那么我们怎么做呢,可以利用aop 加注解的 ...