效果：

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. 根据枚举获取枚举的Description特性值

    首先定义一个枚举:两个值:已确认.未确认. public enum ConfirmStatusEnum { [Description("未确认")] unconfirmed = , ...

  2. P2053 [SCOI2007]修车 费用流

    $ \color{#0066ff}{ 题目描述 }$ 同一时刻有N位车主带着他们的爱车来到了汽车维修中心.维修中心共有M位技术人员,不同的技术人员对不同的车进行维修所用的时间是不同的.现在需要安排这M ...

  3. jquery 中 $('div','li')是什么意思？

     Javascript 专业回答   2013-07-18 10:59 这个写法没有错误,而且那个人跟你说的也没错,是选择li里面所有div 前面几位都学艺不精,都说错了 要搞清楚$('div','l ...

  4. 26.Generate Parentheses（生产有效括号的种类）

    Level:   Medium 题目描述: Given n pairs of parentheses, write a function to generate all combinations of ...

  5. office 2013 破解工具 及 软件下载

     win7/win8/win10  office2013 破解工具 下载地址: https://pan.baidu.com/s/1sZeJOCWq1fZ3KIOWvmrAQQ office2013  ...

  6. Jmeter拓展插件可查看和lr一样的图形结果

    利用插件可通过图形直观查看CPU.Memory等的运行情况 1. JmeterPlugins.jar插件下载地址:http://jmeter-plugins.org/downloads/all 下载并 ...

  7. C++_代码重用2-包含对象成员的类

    对于姓名可以使用字符数组来表示,但这将限制姓名的长度.当然,还可以使用char指针和动态内存分配,但这要求提供大量的支持代码.有一个好的方法就是使用一个他人开发好的类的对象来表示.如果C++库提供了合 ...

  8. poj 1220 NUMBER BASE CONVERSION

    NUMBER BASE CONVERSION Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 5976   Accepted: ...

  9. CF E2 - Array and Segments (Hard version) （线段树）

    题意给定一个长度为n的序列,和m个区间.对一个区间的操作是:对整个区间的数-1可以选择任意个区间(可以为0个.每个区间最多被选择一次)进行操作后,要求最大化的序列极差(极差即最大值 - 最小值).ea ...

  10. C语言实现排序

    //C语言版排序#include<stdio.h> #include<stdlib.h> //冒泡排序 void bubleSort(int data[], int n); / ...