<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <title>JS实现倒计时</title>

    <style>

        *{ margin:0; padding:0; list-style:none;}

        body{ font-size:18px; text-align:center;}

        .time{ height:30px; padding:200px;}

    </style>

</head>

<body>

<div class="time">

    <span id="showInterval"></span>

</div>

<script>

    function getDistanceTime(time,showInterval){

        var endTime= new Date(Date.parse(time.replace(/-/g, "/")));/*replace将时间字符串中所有的'-'替换成'/',parse将时间格式的字符串转换成毫秒*/

        var nowTime = new Date();

        var distance =endTime.getTime() - nowTime.getTime();/*getTime把一个date对象转换成毫秒*/

        var day = 0;

        var hour = 0;

        var minute = 0;

        var second = 0;

        if(distance >= 0){

            day = Math.floor(distance/1000/60/60/24);

            hour = Math.floor(distance/1000/60/60%24);

            minute = Math.floor(distance/1000/60%60);

            second = Math.floor(distance/1000%60);

        }else{

            alert("目标日期小于当前日期!")

        }

        document.getElementById(showInterval).innerHTML = day + "天" +  hour + "时" + minute + "分" + second + "秒";

    }

//    setInterval(function(){getDistanceTime('2016/05/19 12:00:00','showInterval');},0);

    setInterval(function(){getDistanceTime('2017-05-19 12:00:00','showInterval');},0);

</script>

</body>

</html>

传入的日期参数格式,也可以是'2017/05/19 12:00:00'

效果如下:

用JS实现倒计时(日期字符串作为参数)的更多相关文章

  1. libs/tools.js stringToDate dateToString 日期字符串转换函数

    libs/tools.js stringToDate dateToString 日期字符串转换函数 import { stringToDate } from '@/libs/tools.js'   e ...

  2. js时间戳和日期字符串相互转换

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="C ...

  3. 【问题】Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数

    [问题]Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数. [解决]直接对变量加引号,如: <button onclick="deleteProduct('@ ...

  4. 根据日期字符串获取星期几，日期获取星期，时间获取星期，js获取星期

    根据日期字符串获取星期几,日期获取星期,时间获取星期,js获取星期 >>>>>>>>>>>>>>>>&g ...

  5. 【js Date】时间字符串、时间戳转换成今天，明天，本月等文字日期

    作为前端开发攻城师,难免对时间进行各种计算和格式转换,一个js的Date对象统统可以搞定.下例是将一个具体的时间转换成今天.明天.几天之内.本月等文字描述的日期的工具函数,也可以基于它扩展,多应用于网 ...

  6. js 将long型字符串转换成日期格式

    工作中难免会碰到日期的转换,往往为了方便,后台都是把时间以long型(形如1343818800000)返回给web前端.再有前端自己根据页面需求转换成相应的日期格式.这里将我常用的一个转换时间的函数贴 ...

  7. js日期字符串增加天数的函数

    //日期加天数的方法 //dataStr日期字符串 //dayCount 要增加的天数 //return 增加n天后的日期字符串 function dateAddDays(dataStr,dayCou ...

  8. JS处理日期&字符串格式相互转换

    之前找过一些获取系统日期以及日期&字符串格式相互转换的方式,但总体自我感觉来说还是以下的方式会更适合一些. 如有更好的方式,望大家多多赐教和交流,谢谢! 2016年曾写过一次,不过只是发了一下 ...

  9. JS获取浏览器URL中查询字符串的参数

    首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...

随机推荐

  1. code Gym 100500D T-shirts（暴力）

    因为只能买一次,暴力枚举一下买的衣服的大小. #include<cstdio> #include<map> #include<algorithm> using na ...

  2. Kunernetes集群架构与组件

    架构如图: master节点:主要是集群控制面板的功能,来管理整个集群,包括全局的角色,调度,都是在master节点进行控制 有三个组件: API Server:  是 k8s提供的一个统一入口,它是 ...

  3. Asp.Net Core 进阶（四）—— 过滤器 Filters

    一.介绍 Asp.Net Core Filter 使得可以在请求处理管道的特定阶段的前后执行代码,我们可以创建自定义的 filter 用于处理横切关注点. 横切关注点的示例包括错误处理.缓存.配置.授 ...

  4. sql server 定时备份 脚本

    ) DECLARE @date DATETIME SELECT @date = GETDATE() SELECT @filename = 'G:\backup\NewPlulishSQL-' + CA ...

  5. FMDB中的数据处理

    [self.db executeUpdate:@"create table test (a text, b text, c integer, d double, e double)" ...

  6. MFC里 显示设备上下文CClient dc(this) 和 CPaintDC dc(this)

    1 CPaintDC类(1)CPaintDC类是CDC类的一个派生类,该类一般用在响应WM_PAINT消息的函数OnPaint()中.(2)WM_PAINT消息是当窗口的某个区域需要重画时激发的窗口消 ...

  7. B1002 写出这个数

    读入一个正整数 n,计算其各位数字之和,用汉语拼音写出和的每一位数字. 输入格式: 每个测试输入包含 1 个测试用例,即给出自然数 n 的值.这里保证 n 小于 1. 输出格式: 在一行内输出 n 的 ...

  8. 概括的描述一下Spring注册流程

    Spring经过大神们的构思.编码,日积月累而来,所以,对其代码的理解也不是一朝一夕就能快速完成的.源码学习是枯燥的,需要坚持!坚持!坚持!当然也需要技巧,第一遍学习的时候,不用关注全部细节,不重要的 ...

  9. python2和python3中filter函数

    在python2和python3中filter是不同的,其中在python2中filter返回的是一个list,可以直接使用 >>> a = [1,2,3,4,5,6,7] > ...

  10. Golang 简单静态web服务器

    直接使用 net.http 包,非常方便 // staticWeb package main import ( "fmt" "net/http" "s ...