<!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. python3 selenium 超时停止加载,并且捕捉异常, 进行下一步【亲测有效】

    from selenium import webdriver import os import re class GetPage: def __init__(self, url_path): self ...

  2. 12DUILib经典教程(实例)

    Duilib经典实例教程:1基本框架:一个简单的Duilib程序一般是下面这个样子的:://Duilib使用设置部分:#pragmaonce:#defineWIN32_LEAN_AND_ME:#def ...

  3. js 面向对象几种数据模式

    一.单例模式: 把描述同一事物的属性和方法放在同一内存空间下,实现了分组的作用,防止同一属性或者方法冲突.我们把这种分组编写代码的模式叫做单例模式即普通的对象. 单例模式是项目开发中最常用的一种开发模 ...

  4. mysql80版本—yum安装—图文全过程

    这是官网的Quick Giude:https://dev.mysql.com/doc/mysql-yum-repo-quick-guide/en/ 以下为自己安装的步骤: 第一步:下载.rpm安装包 ...

  5. java基础之DateFormat类

    DateFormat DateFormat类概述 DateFormat 是日期/时间格式化子类的抽象类,它以与语言无关的方式格式化并解析日期或时间. 是抽象类,所以使用其子类SimpleDateFor ...

  6. springcloud(十):Hystrix工作流程分析

    通过Netflix Hystrix官方公布的流程图,我们来了解一下Hystrix的工作流程 1.创建HystrixCommand对象或者HystrixObservableCommand对象 首先创建一 ...

  7. (Eclipse) 安装Subversion1.82(SVN)插件

    简介    :SVN是团队开发的代码管理工具,它使我们得以进行多人在同一平台之下的团队开发. 解决问题:Eclipse下的的SVN插件安装. 学到    :Eclipse下的的SVN插件安装. 资源地 ...

  8. hue mysql连接不上数据库排查

    由于CDH所有的组件都会进行agent检测,所以先到/var/log/cloudera-scm-agent(mysql所在节点进行日志排查),可以发现每次连接会产生一个log路径作为记录hue连接my ...

  9. Spring整合JUnit单元测试

    必须先有JUnit的环境(已经导入了Junit4的开发环境) 1.导入jar包 2.在测试类上添加注解 @RunWith(SpringJUnit4ClassRunner.class) @Context ...

  10. mysql5.7基于gtid进行搭建主从复制过程

    gtid_mode = onenforce-gtid-consistency = onskip_name_resolve # 去掉域名解析二进制日志必须开启,且格式为ROWserver-id必须配置成 ...