如何使用 JavaScript 向日期添加小时和分钟？

在本教程中，我们将学习如何使用 JavaScript 向日期添加小时和分钟。我们有多种方法可以实现这一点，如下所示。

  • 使用 setHours() 方法添加小时。

  • 使用 setMinutes() 方法添加分钟。

  • 使用 getTime() 方法添加小时或分钟。

使用 setHours 方法添加小时

JavaScript 日期setHours()方法根据本地时间设置指定日期的小时。

语法

以下是将 setHours() 方法应用于向日期添加小时的语法：

Date.setHours(hours, minutes, seconds, ms)

注意 - 除第一个参数外，其他参数始终是可选的。

参数

  • hours - 一个介于 0 和 23 之间的整数，表示小时。

  • minutes - 一个介于 0 和 59 之间的整数，表示分钟。

  • seconds - 一个介于 0 和 59 之间的整数，表示秒。如果指定了 seconds 参数，则还必须指定 minutes。

  • ms - 一个介于 0 和 999 之间的数字，表示毫秒。如果指定了 ms 参数，则还必须指定 minutes 和 seconds。

方法

要使用 setHours() 方法将小时添加到 Date 对象中，我们首先获取当前时间的小时值，然后将小时数添加到其中，并将添加后的值传递给 setHours() 方法。

示例

在这个示例中，我们向当前时间添加 2 小时。

<html>
<head>
   <title>Example – add hours to date in JavaScript</title>
</head>
<body>
   <h2> Add 2 hours to the JavaScript Date object using setHours( ) method </h2>
   <p> Click on the button to add 2 Hours to the current date/time.</p>
   <button onclick="add()">Click Me</button>
   <p id="currentTime">Current Time : </p>
   <p id="updatedTime">Updated Time: </p>
</body>
<script>
   // Code the show current time
   let ct = document.getElementById("currentTime")
   setInterval(() => {
      let currentTime = new Date().getTime();
      ct.innerText = "Current Time : " + new Date(currentTime).toLocaleTimeString()}, 1000)
   
   // Code to add 2 hours to current Time
   let ut = document.getElementById("updatedTime")
   function add() {
      setInterval(() => {
         let dt = new Date();
         dt.setHours(dt.getHours() + 2);
         ut.innerText = "Updated Time : " + dt.toLocaleTimeString(); 
      }, 1000)
   }
</script>
</html>

使用 setMinutes() 方法添加分钟

日期对象的setMinutes()函数接受一个表示分钟的整数，并用它替换当前日期中分钟的值。

语法

以下是使用 setMinutes() 方法添加分钟的语法：

Date.setMinutes(minutes, seconds , ms );

注意 - 除第一个参数外，其他参数始终是可选的。

参数

  • minutes - 它是一个介于 0 和 59 之间的整数，表示分钟。

  • seconds - 它是一个介于 0 和 59 之间的整数，表示秒。如果指定了 seconds 参数，则还必须指定 minutes。

  • ms - 一个介于 0 和 999 之间的数字，表示毫秒。如果指定了 ms 参数，则还必须指定 minutes 和 seconds。

方法

要使用 setMinutes() 方法将分钟数添加到 Date 对象中，我们首先使用 getMinutes() 方法获取当前时间的分值，然后将所需的分钟数添加到其中，并将添加后的值传递给 setMinutes() 方法。

示例

在这个示例中，我们向当前时间添加 30 分钟。

<html>
<head>
   <title>Example – add minutes to the date</title>
</head>
<body>
   <h2> Add 30 minutes to the JavaScript Date object using setMinutes( ) method </h2>
   <p> Click on the button to add 30 minutes to the current date/time.</p>
   <button onclick="add()">Click Me</button>
   <p id="currentTime">Current Time : </p>
   <p id="updatedTime">Updated Time: </p>
</body>

<script>
   
   // Code the show current time
   let ct = document.getElementById("currentTime")
   setInterval(() => {
      let currentTime = new Date().getTime();
      ct.innerText = "Current Time : " + new Date(currentTime).toLocaleTimeString() }, 1000)

   // Code to add 30 minutes to current Time
   let ut = document.getElementById("updatedTime")
   function add() {
      setInterval(() => {
      let dt = new Date();
      dt.setMinutes(dt.getMinutes() + 30)
      ut.innerText = "Updated Time : " + dt.toLocaleTimeString(); }, 1000)
   }
</script>
</html>

使用 getTime() 方法添加小时或分钟

我们可以应用getTime()方法向 JavaScript Date 对象添加小时或分钟。此方法的语法如下。

语法

Date.getTime()

方法

要将分钟数或小时数添加到 Date 对象中，首先，我们使用 Date.getTime() 方法获取当前时间，然后将我们所需添加时间的毫秒值添加到其中，并将添加后的值传递给 Date 对象。

示例

在这个示例中，我们使用 getTime() 方法向当前时间添加 30 分钟和 2 小时。

<html>
<head>
   <title>Example – add hours or minutes to JavaScript Date object</title>
</head>
<body>
   <h2> Add 30 minutes and 2 hours to the JavaScript Date object using getTime( ) method </h2>
   <p> Click on the button to add 30 minutes and 2 hours to the current date/time.</p>
   <button onclick="add()">Click Me</button>
   <p id="currentTime">Current Time : </p>
   <p id="updatedTime1">Updated Time (Adding 30 minutes): </p>
   <p id="updatedTime2">Updated Time (Adding 2 hours): </p>
</body>

<script>
   
   // Code the show current time
   let ct = document.getElementById("currentTime")
   setInterval(() => {
      let currentTime = new Date().getTime();
      ct.innerText = "Current Time : " + new Date(currentTime).toLocaleTimeString() }, 1000)

   // Code to add 30 minutes and 2 hours to current Time
   let ut1 = document.getElementById("updatedTime1")
   let ut2 = document.getElementById("updatedTime2")

   function add() {
      setInterval(() => {
         
         // Adding 30 minutes
         let dt1 = new Date();
         dt1 = new Date(dt1.getTime() + 30 * 60 * 1000)
         ut1.innerText = "Updated Time (Adding 30 minutes) : " + dt1.toLocaleTimeString();
   
         // Adding 2 hours
         let dt2 = new Date();
         dt2 = new Date(dt2.getTime() + 2 * 60 * 60 * 1000)
         ut2.innerText = "Updated Time (Adding 2 hours) : " + dt2.toLocaleTimeString(); 
      }, 1000)
   }
</script>
</html>

总之，我们讨论了三种向 JavaScript Date 对象添加小时或分钟的方法。第一种方法是使用 setHours() 方法。第二种是使用 setMinutes() 方法，第三种是 getTime() 方法。

更新于: 2022-08-22

11K+ 浏览量

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告

© . All rights reserved.