<script>
(function () {

var tian = document.getElementsByClassName('JS-tian')[0];
var shi = document.getElementsByClassName('JS-shi')[0];
var fen = document.getElementsByClassName('JS-fen')[0];
var miao = document.getElementsByClassName('JS-miao')[0];

var endTime = new Date('2117/07/12 23:59:59').getTime() + 1000;

var interval = null;
interval = setInterval(function () {
var syhm = endTime - Date.now(); // 剩余毫秒
if (syhm >= 0) {
tian.innerText = Math.floor(syhm / 1000 / 60 / 60 / 24);
shi.innerText = Math.floor(syhm / 1000 / 60 / 60 % 24);
fen.innerText = Math.floor(syhm / 1000 / 60 % 60);
miao.innerText = Math.floor(syhm / 1000 % 60);
} else {
clearInterval(interval);
}
}, 0);

})();
</script>
 
 
htmlDemo:
 
<div>
距结束还剩:<span class="JS-tian"></span>天<span class="JS-shi"></span>时<span class="JS-fen"></span>分<span class="JS-miao"></span>秒
</div>

JS - 实现简单易用的倒计时 x 天 x 时 x 分 x 秒的更多相关文章

  1. js学习笔记之日期倒计时(天,时,分,秒)

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. js网页倒计时功能(天,时,分,秒)

    给定任何一个时间,然后实现现在到那个时间的倒计时. 下面的例子是显示现在到2019年8月1号0时0分的倒计时: <div class="list"> <span ...

  3. javascript - 活动倒计时(天、时、分、秒)

    计数时: 结束时: 示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  4. js实现简单易用的上下无缝滚动效果

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  5. Android倒计时:计算两个时间将得到的时间差转化为倒计时(xx时xx分xx秒格式)

    首先是一个自定义控件: public class RushBuyCountDownTimerView extends LinearLayout { // 小时,十位 private TextView ...

  6. vue.js 监听属性的学习/ 千米、米的转换 /时、分、秒 的转换

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. js如何比较两个日期之间相差数(天、时、分、秒)

    首先,我们模拟一个例子 引入js文件 <script type="text/javascript" src="jquery.min.js">< ...

  8. js计算时间差,包括计算,天,时,分,秒

    收集两个计算时间差的计算方法代码片段: var date1=new Date(); //开始时间 var date2=new Date(); //结束时间 var date3=date2.getTim ...

  9. 【JavaScript 实现倒计时(天、时、分、秒)】

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. 刨根究底字符编码之十二——UTF-8究竟是怎么编码的

    UTF-8究竟是怎么编码的 1. UTF-8编码是Unicode字符集的一种编码方式(CEF),其特点是使用变长字节数(即变长码元序列.变宽码元序列)来编码.一般是1到4个字节,当然,也可以更长. 为 ...

  2. Html5模拟通讯录人员排序(sen.js)

    // JavaScript Document var PY_Json_Str = ""; var PY_Str_1 = ""; var PY_Str_2 = & ...

  3. [github项目]基于百度地图二次开发实现的车辆监管(包含车辆定位、车辆图片和方向控制,电子围栏,图形绘制等功能)前端实现(不包含后端实现)

    前言:基于百度地图javascript版本开发,百度地图中所用的key已承诺仅用于测试,不用于商业用途 注:本文所有代码可以到github上进行下载,github地址:http://map.eguid ...

  4. Unexpected end of input 和 Unexpected token var 和 Unexpected token ;

    在写jsp的时候使用的一段代码一直调试,出现Unexpected token ; 错误. 所以最后把代码各种精简,得到了如下的测试示例代码 <% String aaa="123&quo ...

  5. java计算某个日期是什么节气(24节气)

    package com.test; import java.util.Calendar; import java.util.Date; /** * Created by json */ public ...

  6. 将页面内容转换Pdf\Word\Excel格式

    项目中用到了将邮件内容转换为Pdf.Word.Excel格式,做为邮件附件发送. 查了一些解决方案,走了一些弯路.以此代码记录下. 转换PDF需要下载NReco.PdfGenerator.dll 以下 ...

  7. ntopng-一款流量审计框架的安装以及应用

    核心交换机镜像流量审计对于企业应急响应和防患于未然至关重要,本文想通过介绍ntopng抛砖引玉讲一讲流量审计的功能和应用. 安装 安装依赖环境: sudo yum install subversion ...

  8. MongoDB--GridFS 文件存储系统

    GridFS是Mongo的一种专门用存储小型文件的功能. 使用于下列场景: 1.写入文件:mongofiles put 文件路径 注意,当前mongo实例链接的哪个库,将写文件在哪个实例里面的grid ...

  9. v9更换域名

    网站在发展的过程中,很可能多次的修改域名.那么在PHPCMS V9中我们要怎么进行设置呢? 请进行以下步骤的修改: 修改/caches/configs/system.php里面所有和域名有关的,把以前 ...

  10. PostgreSQL数据库web维护客户端工具软件

    TreeSoft数据库管理系统使用JAVA开发,采用稳定通用的springMVC +JDBC架构,实现基于WEB方式对 MySQL,Oracle,PostgreSQL 等数据库进行维护管理操作. 功能 ...