效果：

javascript：

    <script type="text/javascript">

        function countTime() {

            //获取当前时间

            var date = new Date();

            var now = date.getTime();

            //设置截止时间

            var endDate = new Date("2018-10-25 00:00:00");

            var end = endDate.getTime();

            //时间差

            var differTime = end - now;

            //定义变量,h,m,s保存倒计时的时间

            var h, m, s;

            if (differTime >= 0) {

                h = Math.floor(differTime / 1000 / 60 / 60);

                m = Math.floor(differTime / 1000 / 60 % 60);

                s = Math.floor(differTime / 1000 % 60);

                h = h < 10 ? ("0" + h) : h;

                m = m < 10 ? ("0" + m) : m;

                s = s < 10 ? ("0" + s) : s;

                document.getElementById("_h").innerHTML = h + "时";

                document.getElementById("_m").innerHTML = m + "分";

                document.getElementById("_s").innerHTML = s + "秒";

                setTimeout(countTime, 1000);

            } else {

                document.getElementById("_h").innerHTML = "00时";

                document.getElementById("_m").innerHTML = "00分";

                document.getElementById("_s").innerHTML = "00秒";

            }

        }

    </script>

HTML:　

<body onload="countTime()">

    <div class="timer">

        <span id="_h"></span>

        <span id="_m"></span>

        <span id="_s"></span>

    </div>

</body>

　　

js简单时分秒倒计时的更多相关文章

  1. 时分秒倒计时的js实现

    示例: 剩余天数:08天02事02分02秒 html代码: <div id="timer" data-timer="20160628140203" sty ...

  2. 时间格式的转化 vue与js 年月日 时分秒

    首先使用原生转化的方法 第一种 //时间转换 dateStr(d, sign) { //如果没有传递符号,给一个默认的符号 if (!sign) { sign = '-' } //获取d里面年月日时分 ...

  3. js实现时分秒毫秒计时器

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

  4. android 利用CountDownTimer实现时分秒倒计时效果

    https://blog.csdn.net/mrzhao_perfectcode/article/details/81289578

  5. js 倒计时功能，获取当前时间的年月日，时分秒

    一.实现当前时间到指定截止时间的倒计时功能 <html> <head> <title>TEST</title> </head> <bo ...

  6. (转)js实现倒计时效果(年月日时分秒)

    原文链接:http://mengqing.org/archives/js-countdown.html 之前做的活动页面很多都用到了倒计时功能,所以整理下下次直接用.(用的是张鑫旭写的一个倒计时,稍作 ...

  7. JS简单的倒计时(代码优化)

    倒计时网上一大堆,所以也没有什么好说的,支持:1.年,月,日,天,时分秒等倒计时. JS代码如下: /* * js简单的倒计时 * @param {date,obj} 日期 对象格式 */ funct ...

  8. JS获取年月日时分秒

    var d = new Date(); ) + "-" + d.getDate() + " " + d.getHours() + ":" + ...

  9. JS日历控件优化(增加时分秒)

    JS日历控件优化      在今年7月份时候 写了一篇关于 "JS日历控件" 的文章 , 当时只支持 年月日 的日历控件,现在优化如下:      1. 在原基础上 支持 yyyy ...

随机推荐

  1. Win通过端口号结束进程

    准备: 01在cmd中查看命令使用 格式:命令名称 /? 02netstat 03findstr C:\Users\Good>findstr /? 在文件中寻找字符串. ...... strin ...

  2. 查看 tensorflow 是GPU版本 还是CPU版本

    在Python环境中输入: import os from tensorflow.python.client import device_lib os.environ["TF_CPP_MIN_ ...

  3. day--40 mysql-视图，触发器，存储过程，函数总结

    视图,触发器,存储过程,函数总结 一:视图 01:介绍 视图是一个虚拟表(非真实存在),是跑到内存中的表,真实表是硬盘上的表,怎么就得到了虚拟表,就是你查询的结果,只不过之 前我们查询出来的虚拟表,从 ...

  4. codeforces 1101F Trucks and Cities 区间dp+单调优化 好题

    题目传送门 题意简述:(来自洛谷) 有n个城市坐落在一条数轴上,第ii个城市位于位置ai​． 城市之间有m辆卡车穿行．每辆卡车有四个参数:si​为起点编号,fi​为终点编号,ci​表示每行驶1个单位长 ...

  5. 欧拉图 欧拉回路 欧拉通路 Euler的认识 （转）

    转:https://www.cnblogs.com/Ash-ly/p/5397702.html 定义: 欧拉回路:图G的一个回路,如果恰通过图G的每一条边,则该回路称为欧拉回路,具有欧拉回路的图称为欧 ...

  6. BZOJ - 1941 最远估价

    题意:求给出的所有点的最远点减最近点的最小差值 KD树的最远估价和最近估价略微不同,直接找最远垂线,反正xjb改一下就过了 #include<bits/stdc++.h> #define ...

  7. UVA - 11922 区间反转+拼接 可持久化Treap

    题意:一开始给出一个序列\(1,2...n\),然后\(m\)次操作,每次把\([l,r]\)翻转并且拼接到序列的后面,求最后形成的序列 打个pushdown标记就好 #include<iost ...

  8. 关于webpack 以及 webpack配置和常用插件的学习记录 （2） ------ devServer

    DevServer: devserver会启动一个http服务器用于服务网页请求,接收webpack发出的文件变化的信号.通过websocket协议自动刷新网页,实现实时预览. 安装: npm i w ...

  9. Oracle下lag和lead分析函数

    [转自] http://blog.csdn.net/thinkscape/article/details/8290894 Lead和Lag分析函数可以在同一次查询中取出同一字段的前N行的数据(Lag) ...

  10. （转）Openldap相关精品文章

    1.运维咖啡吧 https://mp.weixin.qq.com/s__biz=MzU5MDY1MzcyOQ==&mid=2247483754&idx=1&sn=9f20d45 ...