js-Date对象

孙景荣

已于 2023-01-28 18:10:05 修改

阅读量108

点赞数

分类专栏： JavaScript 文章标签： javascript 前端 html css

于 2022-10-02 17:17:00 首次发布

本文链接：https://blog.csdn.net/ssjjrr/article/details/127144439

版权

JavaScript 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

文章目录

一、日期对象
二、倒计时案例

一、日期对象

1、创建日期对象

new Data()

// 如果没给日期对象传递数值，结果是计算机当前的本地时间;
console.log(new Date()); // Sun Oct 02 2022 17:04:31 GMT+0800 (中国标准时间)

// new Date( 年份 , 月份 , 日期 , 小时 , 分钟, 秒钟 )
// 直接传入参数的形式 月份是从0开始的
console.log(new Date(2022, 10, 3, 0, 0, 0)); // Thu Nov 03 2022 00:00:00 GMT+0800 (中国标准时间)

2、日期对象的信息获取

var d = new Date();

var year = d.getFullYear();

var month = d.getMonth();
// 日期; 
var date = d.getDate();

// 获取小时 
var hour = d.getHours();

// 获取分钟数 ; 
var minute = d.getMinutes();

// 获取秒数; 
var second = d.getSeconds();

// 获取毫秒数 ; 
var msecond = d.getMilliseconds();

// 获取星期几 
var day = d.getDay();

console.log( year , month  , date , day);

3、时间戳

单位是毫秒，1970年1月1日 8 : 00 : 00 到日期对象表示时间之间的毫秒数

console.log( d.getTime() );

// 获取现在时间的时间戳 : 
var t = Date.now() ; 
console.log( t );

二、倒计时案例

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      div {
        width: 400px;
        height: 100px;
        background: red;
        font-size: 70px;
        line-height: 100px;
        text-align: center;
      }
    </style>
  </head>
  <body>
    <h2>距离2022年10月3日0点0时0分0秒还有：</h2>
    <div>00:00:00</div>

    <script>
      function countTime() {
        var d1 = new Date(2022, 9, 3, 0, 0, 0);
        var t1 = d1.getTime();
        var t2 = Date.now();
        var reduce = t1 - t2;
        var day = parseInt(reduce / (1000 * 60 * 60 * 24));
        var hour = parseInt((reduce / (1000 * 60 * 60)) % 24);
        var minute = parseInt((reduce / (1000 * 60)) % 60);
        var second = parseInt((reduce / 1000) % 60);

        var div = document.getElementsByTagName("div");
        div[0].innerText = hour + ":" + minute + ":" + second;
      }
      setInterval(countTime, 1);
    </script>
  </body>
</html>

在这里插入图片描述