用Javascript 实现倒计时
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        .time1{

            width: 500px;

            height: 300px;

            background-color: #cccccc;

            color: red;

            border: 1px solid green;

            margin: 100px auto;

        }

    </style>

</head>

<body>

<div class="time1"></div>

<script>

    var div=document.getElementsByClassName("time1")[0];

   //定义一个计时器

    setInterval(fn,1);

    //封装成功方法，每隔固定时间调用一次

    function fn() {

        //1.获取时间差，将来的时间剪去现在的时间

        var futureTime=new Date("2018/09/08 01:00:00");

        var nowTime=new Date();

        //时间差（毫秒值）=未来时间-当前时间

        var sumMS=futureTime.getTime()-nowTime.getTime();

        //2.把时间差转化成：天时分秒毫秒

        var day=parseInt(sumMS/1000/60/60/24);

        var hour=parseInt(sumMS/1000/60/60%24);

        var minute=parseInt(sumMS/1000/60%60);

        var second=parseInt(sumMS/1000%60);

        var ms=parseInt(sumMS%1000);

        day=day<10?"0"+day:day;

        minute=minute<10?"0"+minute:minute;

        hour=hour<10?"0"+hour:hour;

        second=second<10?"0"+second:second;

       if(ms<10){

           ms="00"+ms;

       }else if (ms<100){

           ms="0"+ms;

       }

        //3.把天时分秒毫秒整合成字符串后赋值给div的innerHTML

        div.innerHTML="距苹果发布会还有："+day+"天"+hour+"小时"+minute+"分"+second+"秒"+ms+"毫秒"

    }

</script>

</body>

</html>

用Javascript 实现倒计时的更多相关文章

  1. javascript的倒计时功能中newData().getTime()在iOS下会报错问题解决

    javascript的倒计时功能中newData().getTime()在iOS下会报错问题解决 在做移动端时间转化为时间戳时,遇到了一个问题,安卓手机上访问时,能拿到时间戳,从而正确转换时间,而在i ...

  2. javascript 时间倒计时

    新加入一个项目的集中开发,遇到一个需要倒计时的需求,经过测试,有以下几种方案,分享出来: 方案一: 页面Html: <span style="font-size:18px;" ...

  3. javascript实现倒计时

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. Javascript实现倒计时和根据某时间开始计算时间

    JavaScript 代码 <script type="text/javascript"> var time_start = new Date('2018','7',' ...

  5. javascript 时间倒计时效果

    <div id="divdown1"></div> <script language="javascript" type=&quo ...

  6. javascript - 活动倒计时(天、时、分、秒)

    计数时: 结束时: 示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  7. Javascript 实现倒计时效果

    代码来自于网上. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  8. JavaScript写倒计时

    在网页中,特别是电商网站中,倒计时的出现频率很高,接下来给大家介绍一下怎么用JavaScript写一个倒计时.代码如下: 首先我们通过Date构造函数的方法创建一个倒计时的结束的时间.并将其转换为毫秒 ...

  9. JavaScript 的倒计时

    一年前,在网上找到的例子,现在已经找不到出处,对不住原作者,请原谅.修改了一下,在刷新页面的情况下,倒计时不重来. 没有任何样式,纯文字倒计时. <!DOCTYPE html> <h ...

随机推荐

  1. Linux基础命令---tune2fs

    tune2fs tune2fs允许系统管理员在Linux ext2.ext3或ext4文件系统上调整各种可调的文件系统参数.这些选项的当前值可以使用-l选项显示,也可以通过使用dumpe2fs (8) ...

  2. spoj1825 Free tour II

    题目链接 一道神奇的点分治 貌似有很多做法,我觉得BIT要好些一些(雾 要求经过黑点数<k就用BIT区间查询前缀 对于每个点用  BIT[0,k-经过黑点数]的最大值+路径长度 使用点分治做到O ...

  3. 关于webpack的path和publicPath。

    path:所有输出文件的目标路径; publicPath:输出解析文件的目录,url 相对于 HTML 页面 区别:path是webpack所有文件的输出的路径,必须是绝对路径,比如:output输出 ...

  4. 自定义redis序列化工具

    redis一个优点就是可以将数据写入到磁盘中. 我们知道写入磁盘的数据实际上都是以字节(0101这样的二进制数据)的形式写入的. 这意味着如果我们要将一个对象写入磁盘,就必须将这个对象序列化. jav ...

  5. perl入门知识（3）

    引用       在很多场合下使用引用传值,能在很大程度上提高代码的运行效率.       定义一个引用在变量名前加”\”就可以了,如:       $ra=\$a;       $rb=\@b;   ...

  6. 【Coursera】Security Introduction -Eighth Week(2)

    Review -Terminology(术语): Confidentiallity & Integrity 泄密 & 欺骗 Confidentiallity: Prevent unau ...

  7. 【转】Makefile 中:= ?= += =的区别

    最近接触使用C++项目,需要使用Makefile,因此需要好好学习下. [转自]:http://www.cnblogs.com/wanqieddy/archive/2011/09/21/2184257 ...

  8. mvc ---- ajax 提交过来的Json格式如何处理（解析）

    前台传过来的不是一个对象,而是一个Json字符串怎么办 ? 如: {","contents":"<p>lsdfjlsdjflsdf</p> ...

  9. UOJ【UR #12】实验室外的攻防战

    题意: 给出一个排列$A$,问是否能够经过以下若干次变换变为排列$B$ 变换:若${A_i> A_i+1}$,可以${swap(A_i,A_i+1)}$ 考虑一个数字从A排列到B排列连出来的路径 ...

  10. http post发送请求

    一: 用java自带URL发送 public synchronized JSONObject getJSON(String url2, String param) { try { URL url = ...