JS - 实现简单易用的倒计时 x 天 x 时 x 分 x 秒
<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>
<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 秒的更多相关文章
- js学习笔记之日期倒计时(天,时,分,秒)
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- js网页倒计时功能(天,时,分,秒)
给定任何一个时间,然后实现现在到那个时间的倒计时. 下面的例子是显示现在到2019年8月1号0时0分的倒计时: <div class="list"> <span ...
- javascript - 活动倒计时(天、时、分、秒)
计数时: 结束时: 示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...
- js实现简单易用的上下无缝滚动效果
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Android倒计时:计算两个时间将得到的时间差转化为倒计时(xx时xx分xx秒格式)
首先是一个自定义控件: public class RushBuyCountDownTimerView extends LinearLayout { // 小时,十位 private TextView ...
- vue.js 监听属性的学习/ 千米、米的转换 /时、分、秒 的转换
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- js如何比较两个日期之间相差数(天、时、分、秒)
首先,我们模拟一个例子 引入js文件 <script type="text/javascript" src="jquery.min.js">< ...
- js计算时间差,包括计算,天,时,分,秒
收集两个计算时间差的计算方法代码片段: var date1=new Date(); //开始时间 var date2=new Date(); //结束时间 var date3=date2.getTim ...
- 【JavaScript 实现倒计时(天、时、分、秒)】
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- 结构化CSS设计思维
LESS.SASS等预处理器给CSS开发带来了语法的灵活和便利,其本身却没有给我们带来结构化设计思维.很少有人讨论CSS的架构设计,而很多框架本身,如Bootstrap确实有架构设计思维作为根基. 要 ...
- JavaSE教程-03深入探究原码,反码,补码-扩展
1.原码,反码,补码的基础概念和计算方法 在搞清楚为什么计算机要使用补码之前,我们先搞清楚一个基本知识点,就是原码,反码,补码的计算方式. 对于一个数,计算机要使用一定的编码方式进行存储,原码,反码, ...
- 看过WWDC2017的闲谈
2017年6月6日凌晨的138分钟,是属于WWDC2017的. 鉴于时间问题,没有熬夜看,所以早上起来趁着公司不太忙就看了看.整体的内容没有太多变化,依然是苹果的主产品,不过这次的one more t ...
- 如何实现windows命令提示符的tab补全
1:使用win+r打开 运行 控制台 2:输入 regedit 打开注册表 3:进入HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Command Processor\Co ...
- PHP编译
编译php-5.3.6的时候需要先打一个内存泄露的补丁,具体的操作如下 tar vzxf suhosin-0.9.32.1.tar.gz tar vjxf php-5.3.6.tar.bz2 cd p ...
- caffe源码学习之Proto数据格式【1】
前言: 由于业务需要,接触caffe已经有接近半年,一直忙着阅读各种论文,重现大大小小的模型. 期间也总结过一些caffe源码学习笔记,断断续续,这次打算系统的记录一下caffe源码学习笔记,巩固一下 ...
- [Linux] PHP程序员玩转Linux系列-腾讯云硬盘扩容挂载
1.PHP程序员玩转Linux系列-怎么安装使用CentOS 2.PHP程序员玩转Linux系列-lnmp环境的搭建 3.PHP程序员玩转Linux系列-搭建FTP代码开发环境 4.PHP程序员玩转L ...
- tomcat之 Tomcat 7.0.78 单机多实例配置
前言:JDK(JavaDevelopment Kit)是Sun Microsystems针对Java开发员的产品.自从Java推出以来,JDK已经成为使用最广泛的javaSDK. JDK是整个Java ...
- 收集一些工作中常用的经典SQL语句
作为一枚程序员来说和数据库打交道是不可避免的,现收集一下工作中常用的SQL语句,希望能给大家带来一些帮助,当然不全面,欢迎补充! 1.执行插入语句,获取自动生成的递增的ID值 INSERT INTO ...
- 关于MATLAB处理大数据坐标文件2017527
第一次提交数据: 今天用了8个特征,加上的这一个特征是 从3000条测试数据中测试失败的数据总结出来的树的数目为50再次使用3000条测试数据测试结果-- 结果不错: 99%但是运行官网数据结果分数- ...