JavaScript Date对象

Unsplash

1. Date 对象的创建

JavaScript 的时间是由世界标准时间(UTC)1970 年 1 月 1 日开始,用毫秒计时

构造函数

new Date();
new Date(value);
new Date(dateString);
new Date(year, month[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);

value 代表自 1970 年 1 月 1 日 00:00:00 (世界标准时间) 起经过的毫秒数 dateString 表示日期的字符串值 year 代表年份的整数值。为了避免2000年问题最好指定4位数的年份; 使用 1998, 而不要用 98 month 代表月份的整数值从0(1月)到11(12月) day 代表一个月中的第几天的整数值,从1开始 hour 代表一天中的小时数的整数值 (24小时制) minute 分钟数 second 秒数 millisecond 表示时间的毫秒部分的整数值

注释:如果没有输入任何参数,则 Date 的构造器会依据系统设置的当前时间来创建一个 Date 对象

2. Date 对象内置的方法

new Date().getTime();

返回 1970 年 1 月 1 日午夜与 Date 对象中的时间值之间的毫秒数,时间戳

运行结果

date.getFullYear();  //获取 Date 对象中的年份值
date.getMonth(); //获取 Date 对象中的月份值
date.getDate();  //获取 Date 对象中的一个月的第几天
date.getDay(); //获取 Date 对象中的星期数,0 表示是星期天,6 表示是星期六
date.getHours(); //获取 Date 对象中的小时值
date.getMinutes(); //获取 Date 对象中的分钟值 
date.getSeconds(); //获取 Date 对象中的秒数值 

运行结果

3. 模拟时钟 Demo

html 部分

<div id="box">
  <span id="timer">xx:xx:xx</span>
  <span id="dater">XX年XX月XX日 星期X</span>
</div>

js 部分

function clock() {
  var d = new Date();
  var year = d.getFullYear();
  var month = d.getMonth();
  var date = d.getDate();
  var day = d.getDay();
  var hours = d.getHours();
  var minutes = d.getMinutes();
  var seconds = d.getSeconds();
  var dayStr = "日一二三四五六";

  //如果小于10的,前面补上 "0"
  hours = (hours < 10) ? ("0" + hours) : hours;
  minutes = (minutes < 10) ? ("0" + minutes) : minutes;
  seconds = (seconds < 10) ? ("0" + seconds) : seconds;
  document.getElementById("timer")
          .innerHTML = hours + ":" + minutes + ":" + seconds;
  document.getElementById("dater")
          .innerHTML = year + "年" + (month + 1) + "月" + date + "日 星期" + dayStr.split("")[day];
}
clock(); //先运行一次
setInterval(clock,1000);

运行结果

4. 倒计时 Demo

html 部分

距离2017年五一劳动节还有:0天0时0分0秒

js 部分

var targetTime = new Date("2017-5-1"); 
function clock() {
  var nowTime = new Date();
  deltaTime = targetTime - nowTime; //隐式转换,得到时间差
  var days = parseInt(deltaTime/1000/60/60/24);
  var hours = parseInt(deltaTime/1000/60/60 % 24);
  var minutes = parseInt(deltaTime/1000/60 % 60);
  var seconds = parseInt(deltaTime/1000 % 60);

  document.body.innerHTML = "距离2017年五一劳动节还有:" + days + "天" + hours + "时" + minutes + "分" + seconds + "秒";
}
clock();
setInterval(clock,1000);

运行结果

End of File

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 腾讯课堂 IMWeb 七天前端求职提升营 Day 6

    本次的系列博文主要是针对 腾讯课堂七天前端求职提升营 课程中,所推送的面试题目及编程练习的一次汇总,期间还包括三次直播课的分享,均由腾讯导师给大家讲解,该系列博...

    Nian糕
  • 腾讯课堂 IMWeb 七天前端求职提升营 Day 5

    本次的系列博文主要是针对 腾讯课堂七天前端求职提升营 课程中,所推送的面试题目及编程练习的一次汇总,期间还包括三次直播课的分享,均由腾讯导师给大家讲解,该系列博...

    Nian糕
  • 腾讯课堂 IMWeb 七天前端求职提升营 Day 7

    本次的系列博文主要是针对 腾讯课堂七天前端求职提升营 课程中,所推送的面试题目及编程练习的一次汇总,期间还包括三次直播课的分享,均由腾讯导师给大家讲解,该系列博...

    Nian糕
  • js时间戳转换日期格式和日期计算

    半指温柔乐
  • shell中的括号(小括号,中括号,大括号)

        ①命令组。括号中的命令将会新开一个子shell顺序执行,所以括号中的变量不能够被脚本余下的部分使用。括号中多个命令之间用分号隔开,最后一个命令可以没有...

    雪影
  • 利用chrome的Timeline观测系统的内存回收逻辑

    通过tab timeline观测到在第3900ms时,系统有一个garbage collection的operation, 总共回收内存425k:

    Jerry Wang
  • 企业面试题:JAVASCRIPT如何获取当前日期的月份

    getTime() 返回 1970 年 1 月 1 日至今的毫秒数。== .valueOf()

    舒克
  • Linux Shell 中的 ()、(())、[]、[[]]、{} 怎么用是不是还傻傻分不清?

    ①命令组。括号中的命令将会新开一个子shell顺序执行,所以括号中的变量不能够被脚本余下的部分使用。括号中多个命令之间用分号隔开,最后一个命令可以没有分号,各命...

    昱良
  • 批量导出某个简书用户的所有文章列表和文章超链接

    虽然简书提供了批量下载文章的功能,但是下载到本地的文章都是markdown格式的,不包含文章的链接,这不满足我的需求。

    Jerry Wang
  • java10系列(二)Local-Variable Type Inference

    本文主要解读下java10的Local-Variable Type Inference

    codecraft

扫码关注云+社区

领取腾讯云代金券