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. spring常见问题

    问题1:提示说:cvc-elt.1: Cannot find the declaration of element 'beans' 解决方法:从网上搜了一些,有的说是因为网络原因访问不到xsd文件,因 ...

  2. OpenVPN使用用户名/密码验证方式

    OpenVPN推荐使用证书进行认证,安全性很高,但是配置起来很麻烦.还好它也能像pptp等vpn一样使用用户名/密码进行认证. 不管何种认证方式,服务端的ca.crt, server.crt, ser ...

  3. iOS如何跳到系统设置里的各种设置界面

    最近项目需要授权时候跳转到相关的设置页面,自己总结了一下,想写到简书上来,和大家分享一下. 在本人测试后,iOS8和9都没有问题,直接跳转到各个页面,这可能苹果对这方面开放了吧.第一步修改plist文 ...

  4. [转载]Java数组扩容算法及Java对它的应用

    原文链接:http://www.cnblogs.com/gw811/archive/2012/10/07/2714252.html Java数组扩容的原理 1)Java数组对象的大小是固定不变的,数组 ...

  5. 可以正确显示表格线的Grid item view

    Android上要显示一个表格,没有Swing那么专门的JTable可用. 搜了下,一般用GridView,有诸多不便和需要自己实现的地方: 跟ListView一样的Adapter,getView的时 ...

  6. [Linux][PHP]安装swoole扩展

    1.下载swoole 2.解压并配置 /usr/local/php/bin/phpize ./configure --enable-swoole-debug --enable-sockets --en ...

  7. VC++ 产生GUID或UUID

    GUID 和 UUID 是一样的,表示全球唯一标识码. 下面是Windows系统中,产生GUID的一种方法(Windows API) char* GUID_Generator() { ] = {}; ...

  8. Android eclipse环境搭建

    1安装JDK  Java环境 首先,我们必须要安装Java环境,提供语言环境支持,Android一般用Java嘛 下载一个JDK 推荐1.6版本以上 安装好后 记得配置一下环境变量 计算机—>属 ...

  9. Error:identifer “blockIdx” and __syncthreads() undefined

    #include "device_launch_parameters.h" for blockIdx #include "device_functions.h" ...

  10. gcd推导

    欧几里得算法有性质: gcd(a, b)=gcd(b, a%b); 那么如何证明呢~ 法1: 我们先假设其成立并且有 gcd(a, b)=gcd(b, a%b)=d; a=k*b+c即a%b=c(我们 ...