JavaScript的DOM学习笔记——5、日期和时间

最新推荐文章于 2025-11-24 03:12:01 发布

原创最新推荐文章于 2025-11-24 03:12:01 发布 · 1k 阅读

19 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #学习 #笔记 #日期 #实践 #时间

H5 专栏收录该内容

46 篇文章

订阅专栏

大家好，我是阿赵。继续学习JavaScript的DOM，这次来学习一下日期时间对象。

一、获取日期时间对象

如果想获得当前系统的时间，可以

const date = new Date();

如果想获得指定日期时间的对象，可以：

const date = new Date(‘2025-10-17’);

二、日期时间对象的内容获取

在获得了上面的日期对象之后，就可以获得它里面的内容了。
例子：

<body>
  <script>
    const date = new Date();
    document.write(date.getFullYear() + '年' + (date.getMonth() + 1) + '月' + date.getDate() + '日 <br/>');
    document.write(date.getHours() + '时' + date.getMinutes() + '分' + date.getSeconds() + '秒<br/>');
    document.write('今天是星期' + date.getDay() + '<br/>');

    document.write('格式化1：' + date.toLocaleString() + '<br/>');
    document.write('格式化2：' + date.toLocaleDateString() + '<br/>');
    document.write('格式化3：' + date.toLocaleTimeString() + '<br/>');
  </script>
</body>

显示：
在这里插入图片描述

这里用到了2种内容：

1、获取日期时间属性

1. getFullYear

获取四位数的年份

2. getMonth

获取月份，取值是0-11，所以在显示月份的时候，要加1.

3. getDate

获取在本月份里面的第几天，不同的月份取值会不一样。

4. getDay

获取星期几，取值是0-6，其中0是星期天

5. getHours

获取小时，取值是0-23

6. getMinutes

获取分钟，取值是0-59

7. getSeconds

获取秒数，取值是0-59

2、格式化时间显示

1. toLocaleString

获取完整的年月日时分秒的显示格式字符串，比如：

2025/10/17 16:48:23

2. toLocaleDateString

获取只有年月日的显示格式字符串，比如：

2025/10/17

3. toLocaleTimeString

获取只有时间的显示格式字符串，比如：

16:48:23

三、时间戳

1、时间戳是什么

时间戳是指格林威治时间1970年01月01日00时00分00秒（北京时间1970年01月01日08时00分00秒）起至现在所经过的时间。在JavaScript里面，获得时间戳方法返回的时间单位是毫秒。

2、时间戳的作用

时间戳是一个表示特定时间点的数据，它通常用于记录事件发生的确切时间。它广泛应用于计算机系统、数据库、网络通信等领域，确保数据的一致性和完整性。
如果一个应有有前后端通讯的情况下，后端要告诉前端一个活动开始的时间，比如1个小时后需要开启一个特价活动，让前端去显示内容。如果后端只是告诉前端1小时这个数据，在前端收到这个消息的时候，可能不知道这个1小时是从什么时间点开始算，如果从接到消息的时候开始算1个小时，由于网络延迟或者各种原因，可能会导致时间不准确。
如果后端发送的活动开始时间是一个时间戳，那么就能很明确的约定好具体的时间，客户端可以根据这个具体时间，自己去倒计时显示内容。

3、获取时间戳的方法

1.getTime

const date = new Date();
document.write(date.getTime());

通过日期时间对象的getTime方法，可以获得指定日期对象的时间戳。

2. new Date

document.write(+new Date());

无需先实例化日期时间对象，直接在用的时候获取。

3. Date.now

document.write(Date.now());

同样无需先实例化日期时间对象，直接获取，但这个只能获取到当前时间的时间戳。

在这里插入图片描述