效果：

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. 《 V I M 教 程 》 —— 版本 1.7

    =============================================================================== = 欢 迎 阅 读 < V I M ...

  2. 在请求中存取属性setAttribute&getAttribute方法

    在请求中保存属性: public void setAttribute(String name,Object o) request.setAttribute("mess"," ...

  3. 魔方方法之--类的构造(__init__,__new__)和析构(__del__)方法

    构造方法(参见小甲鱼入门教程) __ init__()方法:类的初始化方法,初始化类对象时被调用,需要的时候再调用它 注意点:这个方法的返回值必须是None class Rectangle(): de ...

  4. js 简单数据类型和复杂数据类型的区别

    原始数据类型: number,string,boolean,undefined, null,object 基本类型(简单类型),值类型: number,string,boolean 复杂类型(引用类型 ...

  5. K3 Wise 常用表【转载】

    在后台数据库ICClassType表中,字段FID<0的是老单,FID>0的是新单.--事务类型select * from ICClassType            where  FT ...

  6. C++_异常4-将对象用作异常类型

    通常,引发异常的函数将传递一个对象.这样做的重要优点之一就是,可以利用不同的异常类型来区分不同的函数在不同的情况下引发的异常. 对象可以携带信息,程序员可以根据这些信息来确定异常的原因. 同时,cat ...

  7. 洛谷 P1560 [USACO5.2]蜗牛的旅行Snail Trails

    题目链接 题解 一看题没什么思路.写了个暴力居然可过?! Code #include<bits/stdc++.h> #define LL long long #define RG regi ...

  8. 网络寻路（思维+vector的应用）-----------蓝桥备战系列

    标题:网络寻路 X 国的一个网络使用若干条线路连接若干个节点.节点间的通信是双向的.某重要数据包,为了安全起见,必须恰好被转发两次到达目的地.该包可能在任意一个节点产生,我们需要知道该网络中一共有多少 ...

  9. MITx: 6.00.1x Introduction to Computer Science and Programming Using Python Week 2: Simple Programs 4. Functions

    ESTIMATED TIME TO COMPLETE: 18 minutes We can use the idea of bisection search to determine if a cha ...

  10. Codeforces - 185A 简单矩阵快速幂

    题意:求第n个三角形内部的上三角形个数 对每个三角形分别维护上下三角形个数,记为\(dp[1][i],dp[2][i]\) 规律很明显是 \(dp[1][i+1]=3*dp[1][i]+dp[2][i ...