文档章节

Date对象简单实例

尼阿卡
 尼阿卡
发布于 2016/03/18 18:42
字数 373
阅读 56
收藏 5

对于Date对象,学过javascript的应该都是比较熟悉的了,下面直接给出一个实例

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>时间显示效果</title>
<script type="text/javascript">
  window.onload = function(){
    showTime();
    freshTime();
  }

  function checkTime(i){  //补位处理
      if(i<10){
          i="0"+i;
      }
    return i;
  }
  //时间显示效果
  function showTime(){
    var now=new Date();
    var year=now.getFullYear();
    var month=now.getMonth()+1;
    var day=now.getDate();
    var d=now.getDay();
    var h=now.getHours();
    var m=now.getMinutes();
    var s=now.getSeconds();
    m=checkTime(m);
    s=checkTime(s);

    var weekday=new Array(7);
    weekday[0]="星期日"
    weekday[1]="星期一"
    weekday[2]="星期二"
    weekday[3]="星期三"
    weekday[4]="星期四"
    weekday[5]="星期五"
    weekday[6]="星期六"

    document.getElementById("time").innerHTML=""+year+"年"+month+"月"+day+"日 "+  weekday[d] +h+":"+m+":"+s;
    t=setTimeout('showTime()',500);//半秒运行一次
  }
  //倒计时效果
  function freshTime(){
    var endtime = new Date("2016,6,6,12:00:00");
    var nowtime = new Date();
    var lefttime = Math.floor((endtime.getTime() - nowtime.getTime())/1000);//获取总秒数
    var d = Math.floor(lefttime/(24*60*60));//获取天数
    var h = Math.floor(lefttime/(60*60)%24);//获取时数
    var m = Math.floor(lefttime/(60)%60);//获取分数
    var s = Math.floor(lefttime%60);//获取秒数
    m=checkTime(m);
    s=checkTime(s);

    if(lefttime<=0){
      document.getElementById("counter").innerHTML="计时结束";
      clearTimeout(sh);
    }else{
       document.getElementById("counter").innerHTML="距离结束还有 "+d+"天"+h+"时"+m+"分"+s+"秒";
    }
    sh = setTimeout("freshTime()",500);
  }
</script>
</head>
<body>
<p>显示系统时间:<span id="time"></span></p>
<p>显示倒计时:<span id="counter"></span></p>
</body>
</html>

然后在浏览器上的效果如下

© 著作权归作者所有

尼阿卡
粉丝 3
博文 24
码字总数 8902
作品 0
珠海
程序员
私信 提问
如何继承Date对象?由一道题彻底弄懂JS继承。

前言 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会及时修正。 20180201更新: 修改用词描述,如组合寄生式改成寄生组合式,修改多处笔误(感谢@Yao Ding的反馈) ----------长...

dailc
02/18
0
0
js日历控件开发

最终日历控件实例代码地址:http://www.oschina.net/code/snippet235264455198 什么是日历控件?效果什么样子?这是一个网站上的在线演示效果:http://www.jq22.com/yanshi5303 我们开发的最...

透笔度
2016/04/05
374
2
Spring中bean的配置

IOC其实是从我们平常new一个对象的对立面来说的,我们平常使用的对象一般直接使用关键字类new一个对象,坏处很显然,使用new那么就表示当前模块已经不知不觉和new出的对象耦合了,而我们通常...

大黄有故事
2016/10/18
0
0
Spring技巧之活用FactoryBean

Spring中有两种类型的Bean,一种是普通Bean,另一种是工厂Bean,即FactoryBean。工厂Bean跟普通Bean不同,其返回的对象不是指定类的一个实例,其返回的是该工厂Bean的getObject方法所返回的对...

DSLZTX
2013/05/05
154
0
Spring单例与线程安全小结

一、Spring单例模式与线程安全 Spring框架里的bean,或者说组件,获取实例的时候都是默认的单例模式,这是在多线程开发的时候要尤其注意的地方。 单例模式的意思就是只有一个实例。单例模式确...

勇敢的蜗牛_Z
2016/04/07
112
0

没有更多内容

加载失败,请刷新页面

加载更多

OSChina 周六乱弹 —— 早上儿子问我他是怎么来的

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @凉小生 :#今日歌曲推荐# 少点戾气,愿你和这个世界温柔以待。中岛美嘉的单曲《僕が死のうと思ったのは (曾经我也想过一了百了)》 《僕が死の...

小小编辑
今天
1K
14
Excption与Error包结构,OOM 你遇到过哪些情况,SOF 你遇到过哪些情况

Throwable 是 Java 中所有错误与异常的超类,Throwable 包含两个子类,Error 与 Exception 。用于指示发生了异常情况。 Java 抛出的 Throwable 可以分成三种类型。 被检查异常(checked Exc...

Garphy
今天
38
0
计算机实现原理专题--二进制减法器(二)

在计算机实现原理专题--二进制减法器(一)中说明了基本原理,现准备说明如何来实现。 首先第一步255-b运算相当于对b进行按位取反,因此可将8个非门组成如下图的形式: 由于每次做减法时,我...

FAT_mt
昨天
40
0
好程序员大数据学习路线分享函数+map映射+元祖

好程序员大数据学习路线分享函数+map映射+元祖,大数据各个平台上的语言实现 hadoop 由java实现,2003年至今,三大块:数据处理,数据存储,数据计算 存储: hbase --> 数据成表 处理: hive --> 数...

好程序员官方
昨天
61
0
tabel 中含有复选框的列 数据理解

1、el-ui中实现某一列为复选框 实现多选非常简单: 手动添加一个el-table-column,设type属性为selction即可; 2、@selection-change事件:选项发生勾选状态变化时触发该事件 <el-table @sel...

everthing
昨天
20
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部