JavaScript学习笔记（四）

news2024/11/18 14:13:20

22、日期

JavaScript 日期输出，默认情况下，JavaScript 将使用浏览器的时区并将日期显示为全文本字符串：

   var data = new Date();

输出：Tue Jun 25 2024 14:45:44 GMT+0800 (中国标准时间)

22.1 创建 Date 对象

Date 对象由新的 Date() 构造函数创建。

有 4 种方法创建新的日期对象：

new Date()
new Date(year, month, day, hours, minutes, seconds, milliseconds)
new Date(milliseconds)
new Date(date string)

22.1.1 new Date()

   var data = new Date();

输出：Tue Jun 25 2024 14:45:44 GMT+0800 (中国标准时间)

22.1.2 new Date(year, month, …)

new Date(year, month, ...) 用指定日期和时间创建新的日期对象。
7个数字分别指定年、月、日、小时、分钟、秒和毫秒（按此顺序）
JavaScript 从 0 到 11 计算月份。一月是 0。十二月是11。

示例：6个数字指定年、月、日、小时、分钟、秒：
（5个数字指定年、月、日、小时和分钟，4个数字指定年、月、日和小时，3 个数字指定年、月和日，2个数字指定年份和月份，不能省略月份。如果只提供一个参数，则将其视为毫秒）

 <body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date(2024, 6, 25,11,30,54,55);
      document.getElementById("demo").innerHTML = data;
    </script>
  </body>

输出:Thu Jul 25 2024 11:30:54 GMT+0800 (中国标准时间)

22.1.3 new Date(dateString)

new Date(dateString) 从日期字符串创建一个新的日期对象

var d = new Date("October 13, 2014 11:13:00");

输出：Wed Dec 25 2019 12:46:00 GMT+0800 (中国标准时间)

22.1.4 new Date(milliseconds)

new Date(milliseconds) 创建一个零时加毫秒的新日期对象

var d = new Date(0);

输出：Thu Jan 01 1970 08:00:00 GMT+0800 (中国标准时间)

22.2 显示日期

d = new Date();

（1）在 HTML 中显示日期对象时，会使用 toString() 方法自动转换为字符串。

document.getElementById("demo").innerHTML = d.toString();

输出：Tue Jun 25 2024 14:59:45 GMT+0800 (中国标准时间)

（2）toUTCString() 方法将日期转换为 UTC 字符串（一种日期显示标准）。

document.getElementById("demo").innerHTML = d.toUTCString();

输出：Tue, 25 Jun 2024 07:00:36 GMT

（3）toDateString() 方法将日期转换为更易读的格式：

document.getElementById("demo").innerHTML = d.toDateString();

输出：Tue Jun 25 2024

22.3 JavaScript 日期格式

有四种 JavaScript 日期输入格式：
在这里插入图片描述

22.2.1 JavaScript ISO 日期

(1) 完整的日期加时、分和秒

用大写字母 T 分隔日期和时间。
用大写字母 Z 标识 UTC 时间。

 var d = new Date("2018-02-19T12:00:00");

输出：Thu May 02 2019 20:00:00 GMT+0800 (中国标准时间)

（2）完整日期

 var d = new Date("2018-02-19");

输出：Thu May 02 2019 08:00:00 GMT+0800 (中国标准时间)

（3）年和月

写日期也可以不规定具体某日 (YYYY-MM)

var d = new Date("2015-03");

输出：Wed May 01 2019 08:00:00 GMT+0800 (中国标准时间)

（4）只有年

写日期也可以不规定具体的月和日 (YYYY)

 var d = new Date("2018");

输出：Mon Jan 01 2018 08:00:00 GMT+0800 (中国标准时间)

22.2.2 JavaScript 短日期

短日期通常使用 “MM/DD/YYYY” 这样的语法
在某些浏览器中，不带前导零的月或其会产生错误

var d = new Date("02/19/2018");

输出：Sun May 26 2019 00:00:00 GMT+0800 (中国标准时间)

22.2.3 JavaScript 长日期

长日期通常以 “MMM DD YYYY” 这样的语法来写

var d = new Date("Feb 19 2018");

月和天能够以任意顺序出现

var d = new Date("19 Feb 2018");

并且，月能够以全称 (January) 或缩写 (Jan) 来写

var d = new Date("February 19 2018");

逗号会被忽略，且对大小写不敏感

var d = new Date("FEBRUARY, 25, 2015");

22.2.4 JavaScript 完整日期

JavaScript 接受“完整 JavaScript 格式”的日期字符串

var d = new Date("Mon Feb 19 2018 06:55:23 GMT+0100 (W. Europe Standard Time)");

JavaScript 会忽略日期名称和时间括号中的错误

var d = new Date("Fri Mar 26 2018 09:56:24 GMT+0100 (Tokyo Time)");

23、JavaScript 日期获取方法

日期方法允许您获取并设置日期值（年、月、日、时、分、秒、毫秒）
日期获取方法：

23.1 getTime() 方法

getTime() 方法返回自 1970 年 1 月 1 日以来的毫秒数

   <body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date(2024, 06, 25);
      document.getElementById("demo").innerHTML = data.getTime();
    </script>
  </body>

输出：1721836800000

23.2 getFullYear() 方法-`年份`

getFullYear() 方法以四位数字形式返回日期年份

 <body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getFullYear();
    </script>
  </body>

输出：2024

23.3 getMonth() 方法-`月份`

getMonth() 以数字（0-11）返回日期的月份

<body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getMonth() + 1;
    </script>
  </body>

输出：6

23.4 getDate() 方法-`日期`

getDate() 方法以数字（1-31）返回日期的日

<body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getDate();
    </script>
  </body>

输出：25

23.5 getHours() 方法-`小时`

getHours() 方法以数字（0-23）返回日期的小时数

<body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getHours();
    </script>
  </body>

输出：15

23.6 getMinutes() 方法-`分钟`

getMinutes() 方法以数字（0-59）返回日期的分钟数

 <body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getMinutes();
    </script>
  </body>

输出：45

23.7 getSeconds() 方法-`秒数`

getSeconds() 方法以数字（0-59）返回日期的秒数

 <body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getSeconds();
    </script>
  </body>

23.8 getMilliseconds() 方法-`毫秒`

getMilliseconds() 方法以数字（0-999）返回日期的毫秒数

<body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getMilliseconds();
    </script>
  </body>

23.9 getDay() 方法-`周`

getDay() 方法以数字（0-6）返回日期的星期名（weekday）

 <body>
    <p><span id="demo"></span></p>
    <script>
      var data = new Date();
      document.getElementById("demo").innerHTML = data.getDay();
    </script>
  </body>