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. CentOS6.3 编译安装LAMP(4)：编译安装 PHP5.2.17

    所需源码包: /usr/local/src/PHP-5.2.17/libmcrypt-2.5.8.tar.gz /usr/local/src/PHP-5.2.17/mhash-0.9.9.9.tar. ...

  2. .htaccess 基础教程（四）Apache RewriteCond 规则参数

    Apache模块 mod_rewrite 提供了一个基于正则表达式分析器的重写引擎来实时重写URL请求.它支持每个完整规则可以拥有不限数量的子规则以及附加条件规则的灵活而且强大的URL操作机制.此UR ...

  3. javascript基础04

    javascript基础04 1.循环语句 1.While 语句: while (exp) { //statements; } var i = 1; while(i < 3){ alert(i) ...

  4. 通过goto语句学习if...else、switch语句并简单优化

    goto语句在C语言中实现的就是无条件跳转,第二章一上来就介绍goto语句就是要通过goto语句来更加清楚直观的了解控制结构. 我理解的goto语句其实跟switch语句有相似之处,都是进行跳转.不同 ...

  5. java环境配置为1.7jdk为什么cmd java -version查看版本是1.8

    记录一个小问题: 初始安装的是jdk1.8,后来项目需要要更换成jdk1.7, 因此将环境变量更改为jdk7的目录路径, 但是在cmd命令行运行java -version 发现还是jdk8 解决方法: ...

  6. 网络流n题 题解

    学会了网络流,就经常闲的没事儿刷网络流--于是乎来一发题解. 1. COGS2093 花园的守护之神 题意:给定一个带权无向图,问至少删除多少条边才能使得s-t最短路的长度变长. 用Dijkstra或 ...

  7. shutil复制粘贴和压缩

    shutil复制粘贴和压缩 shutil 高级的文件.文件夹.压缩包处理模块 @1).将文件内容拷贝到另一个文件中 import shutil shutil.copyfileobj(open(&quo ...

  8. cookie 和session 区别

    会话技术: Cookie:客户端技术.将数据保存在客户端浏览器上.Cookie是有大小和个数的限制. Session:服务器端技术.将数据保存在服务器端.Session没有大小和个数限制.Sessio ...

  9. 【XLL 框架库函数】 TempErr/TempErr12

    创建一个包含了 Excel 工作表错误的临时 XLOPER/XLOPER12 原型 LPXLOPER TempErr(WORD err); LPXLOPER12 TempErr12(BOOL err) ...

  10. javascript 核心语言笔记- 2 语法结构

    字符集 JavasSript 程序是用 Unicode 字符集 编写的,Unicode 是 ASCII 和 Latin-1 的超集,支持几乎所有在用的语言.ECMAScript 3 要求 JavaSc ...