用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. Ignite集群管理——基于静态IP的节点发现

    Ignite作为分布式内存,集群管理必不可少,Ignite支持基于组播,静态IP,Zookeeper,JDBC等方式发现节点,本文主要介绍基于静态IP的节点发现. 两个最重要的TCP通信设置类: 1. ...

  2. linux服务器管理员的12个有用的命令

    ifconfig: 在修改内核中已有的网络接口时,你会用到ifconfig命令.这个命令通常用于系统调校和调试,但同时也可以用于在启动过程中设置接口. netstat: 对于Linux用户来说这是一个 ...

  3. JUC原子类 1

    根据修改的数据类型,可以将JUC包中的原子操作类可以分为4类. 1. 基本类型: AtomicInteger, AtomicLong, AtomicBoolean ; 2. 数组类型: AtomicI ...

  4. java异常复习

    如果有时学东西概念太多了,可以反着学,从结果到过程,从代码到概念,也许就不会那么枯燥了,比如学反射的时候. java异常复习 异常和错误的区别? 异常:程序或环境本身出现错误.(程序员可以捕获并处理) ...

  5. Linux系统下（x64）安装jdk 1.6(jdk-6u45-linux-x64.bin)

    Linux系统下(x64)安装jdk 1.6(jdk-6u45-linux-x64.bin) 一,查看是否安装jdk: # rpm -qa | grep jdk 或者 #rpm -q jdk 或者 # ...

  6. 2018-2019-1 1723《程序设计与数据结构》第3&4周作业 总结

    作业要求 第三周作业: 提交情况如图: 第四周作业: 提交情况如图: 作业问题 1.问题总结方面希望大家的解决过程不要完全复制百度出来的或者其他博客的内容.因为很明显,没有自己的思考过程.可以先把参考 ...

  7. HDU 1686 Oulipo（KMP）题解

    题意:主串中能找到几个模式串 思路:超详细解释KMP KMP:针对这个代码,解释一下Fail数组的含义:T为主串,P为模式串,Fail代表失配值,即当P[j] != T[i]时,j要指向的位置为Fai ...

  8. BZOJ1398: Vijos1382寻找主人 Necklace 字符串最小表示法

    Description 给定两个项链的表示,判断他们是否可能是一条项链. Input 输入文件只有两行,每行一个由0至9组成的字符串,描述一个项链的表示(保证项链的长度是相等的). Output 如果 ...

  9. CSS3 常用选择器

    p:last-of-type{background-color: red;} 选择p中最后一项 p:nth-of-type(2n){background-color: red;} 隔行变色里面也可以填 ...

  10. C#学习笔记（八）：多维数组

    一维数组 冒泡排序 二维数组 Length:取数组元素的总个数 GetLength:取不同维度的个数 using System; using System.Collections.Generic; u ...