JavaScript时间类

     获取时分秒：
         getHours()
         getMinutes();
         getSeconds();
      获取年月日：
         getFullYear();
         getMonth() + 1;//获取的月份需要+1；
         getDate(); //日期
         getDay(); //获取的是星期，0--》星期天
     实例：（效果图）
                         

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>电子时钟</title>

    <style type="text/css">

    *{

        margin: 0;

        padding: 0;

    }

     #wrap{

         width: 200px;

         height: 100px;

         background-color: black;

     }

     #time{

          color: #fff;

          display: block;

          font-size: 24px;

          margin: 0 auto;

          padding-top: 20px;

          /*border: 1px solid red;*/

          text-align: center;

          width: 100px;

     }

     #timer{

         color: green;

          display: block;

          font-size: 18px;

          margin: 0 auto;

          padding-top: 10px;

          /*border: 1px solid red;*/

          text-align: center;

          /*width: 100px;*/

     }

    </style>

</head>

<body>

       <div id="wrap">

            <span id="time"></span>

         <span id="timer"></span>

       </div>

     <script type="text/javascript">

       var time =document.getElementById("time");

        var timer =document.getElementById("timer");

       setInterval(function() {

        var date = new Date();

        var hours = date.getHours();

        var minutes = date.getMinutes();

        var seconds = date.getSeconds();

        var years = date.getYear();

        var dates = date.getDate();

        var monts = date.getMonth()+1;

    var day = date.getDay();

        var parses = date.getMilliseconds()%60;

     switch(day){

          case 0:

          day="日";

           case 1:

          day="一";

           case 2:

          day="二";

           case 3:

          day="三";

           case 4:

          day="四";

           case 5:

          day="五";

           case 6:

          day="六";

     }

        //如果秒数小于十，在秒数面前连接一个0

        if(seconds < 10) {

            seconds = "0" + seconds;

        }

        //如果分钟数小于十，在分钟数面前连接一个0

        if(minutes < 10) {

            minutes = "0" + minutes;

        }

        //如果小时数小于十，在小说数面前连接一个0

        if(hours < 10) {

            hours = "0" + hours;

        }

        if(years<1900) {

            years = years+1900;

        }

        if(dates<10) {

            dates = "0" + dates;

        }

        if(monts<10) {

            monts = "0" + monts;

        }

        if(parses<10) {

            // parses = "0" + parses;

        }

        timer.innerHTML =  years +"年" +monts+ "月" +dates +"号"+"星期"+day;

            time.innerHTML = hours + ":" + minutes + ":" + seconds + ":" + parses;

        // date.getTime()//返回的是一个从1970年到当前的毫秒数（时间戳）（ms）

        // date.getMonth()//返回的是月份，从0开始算

        // date.getFullYear();

    },10)

     </script>

</body>

</html>

2.倒计时

 <!doctype html>

<html>

<meta charset="utf-8">

<title>倒计时</title>

<head> 

     <style type="text/css">

     *{

         margin: 0;

         padding: 0;

     }

       .wrap{

           width: 350px;

           height: 100px;

           background-color: black;

       }

       #dates{

           color: #fff;

           margin-top: 10px;

           display: block;

           margin-left: 15px;

       }

       p{

           color: #fff;

       }

     </style>

</head>

<body>

<div class="wrap">

    <p>距离2016年02月08号00时00分00秒春节倒计时：</p>

    <!-- <p>距离2016年01月07号23时59分59秒倒计时：</p> -->

    <span id="dates"></span>

</div>

<script type="text/javascript">

var dates = document.getElementById("dates");

function getRTime(){

var EndTime= new Date('2016/02/07 23:59:59'); //截止时间

var NowTime = new Date();

var t =EndTime.getTime() - NowTime.getTime(); 

var d=Math.floor(t/1000/60/60/24);

var h=Math.floor(t/1000/60/60%24);

var m=Math.floor(t/1000/60%60);

var s=Math.floor(t/1000%60);

var p=Math.floor(t%60);

if(d<10){

   d="0"+d;

}

if(h<10){

   h="0"+h;

}

if(m<10){

   m="0"+m;

}

if(s<10){

   s="0"+s;

}

if(p<10){

   p="0"+p;

}

dates.innerHTML=d+ "日" + h + "小时"+ m +"分" + s +"秒"+p+"毫秒";

}

setInterval(getRTime,1);

</script>

</body>

</html>

JavaScript电子时钟+倒计时的更多相关文章

  1. Javascript 电子时钟源码

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  2. JS实现电子时钟

          目前有个小项目,在首页头部导航栏里需要一个电子时钟的效果,于是我就采用如下代码实现了一个电子时钟的效果.不过不完美,第一种方式容易导致网页莫名其妙的异常,后来觉得可能是做的操作太多了,然后 ...

  3. 如何用iframe标签以及Javascript制作时钟？

    如何利用iframe标签以及Javascript制作时钟? 如何制作一个时钟呢?效果如下图所示: 这里的时钟会不停的走,但是下面的页面是不会变得,这样就实现了我们想要的效果了.下面我将分为以下几个方面 ...

  4. 桌面小部件----LED电子时钟实现

    桌面控件是通过 Broadcast 的形式来进行控制的,因此每个桌面控件都对应于一个BroadcastReceiver.为了简化桌面控件的开发,Android 系统提供了一个 AppWidgetPro ...

  5. Qt - 与众不同的电子时钟

     Qt的电子时钟是个老掉牙的demo了,但是利用lcdNumber显示的样子非常老土(下图第一个显示效果),一看就知道是从qt帮助文档里摘出来的example,毫无新意. 美化一下系统时钟,抛开固有控 ...

  6. [TPYBoard-Micropython之会python就能做硬件 3] 制作电子时钟

    转载请注明:@小五义 http://www.cnblogs.com/xiaowuyi 欢迎加入讨论群 64770604 一.本次实验所需器材 1.TPYboard V102板  一块 2.DS3231 ...

  7. 3分钟利用TurnipBit制作电子时钟

    转载请注明:@小五义 http://www.cnblogs.com/xiaowuyi 欢迎加入讨论群 64770604 TurnipBit(www.turnipbit.com)是一个面向青少年的开发板 ...

  8. Micropython TurnipBit 电子时钟 青少年编程入门

    电子时钟是一个很常用但是制作非常简单的小玩具了,对于Micropython初学者来说,制作一个电子时钟是非常简单又容易检验自己学习成果的实验了.TurnipBit相比于其他开发板,制作电子时钟就更加简 ...

  9. MFC桌面电子时钟的设计与实现

    目录 核心技术 需求分析 程序设计 程序展示 (一)核心技术 MFC(Micosoft Foundation Class Libay,微基础类库)是微基于Windows平台下的C++类库集合,MFC包 ...

随机推荐

  1. asp.net数据控件遍历 获取当前索引

    Gridview 数据访问遍历1.for遍历for (int i = 0; i <= GridView1.Rows.Count - 1; i++)//为gv的每一行增加js事件{   TextB ...

  2. UVa2326

    理解:区域覆盖.注意1,属于的区间有大小颠倒的情况:注意2,看图 ,两排房间公用一条走廊(for instance 1->3  4->6 不可公用) #include<iostrea ...

  3. install alilang

    $sudo dpkg -i alilang.deb $ sudo alilang

  4. Proj.4坐标系统创建参数

    Proj.4坐标系统创建参数 本文由乌合之众lym瞎编,欢迎转载blog.cnblogs.net/oloroso 本文原文地址(https://github.com/OSGeo/proj.4/wiki ...

  5. IEnumerable和IQueryable和Linq的查询

    IEnumerable和IEnumerable 1.IEnumerable查询必须在本地执行.并且执行查询前我们必须把所有的数据加载到本地.而且更多的时候.加载的数据有大量的数据是我们不需要的无效数据 ...

  6. HTML 简单的介绍

    Q: 什么是HTML? A: HTML 是一种超文本标记语言. 所谓的超文本是指指页面内可以包含图片,链接,甚至音乐.程序等非文字元素.超文本标记语言的结构包括"头"部分(英语:H ...

  7. sql server 语句使用规范

    Sql语句使用规范 规范内容以及注意事项: 1.查询时候使用top 10 /top 100 和where 字句控制每次执行SQL 返回的结果集合,在满足业务需求的同时返回最小的结果. 2.使用数据投影 ...

  8. Ubuntu 配置有线网 IP

    方法1: 最直接的办法,就是在右上端的网络那里点设置,然后add,选以太网,然后IPV4里,手动设置 -- add IP -- 填入IP地址.网关.子网掩码,OK. 方法2,3见网上教程: Ubunt ...

  9. 一则奇怪的案例处理：ORA-00257: archiver error. Connect internal only, until freed

    前天,业务反应数据库不能连接 在操作系统通过字符串尝试登陆数据库报:ORA-00257: archiver error. Connect internal only, until freed 解决思路 ...

  10. 【leetcode】Climbing Stairs

    题目简述: You are climbing a stair case. It takes n steps to reach to the top. Each time you can either ...