如何使用 JavaScript 将秒转换为 HH-MM-SS 格式？

在本教程中，我们将学习如何使用原生 JavaScript 将秒转换为小时、分钟和秒（HH-MM-SS）格式。

日期和时间是我们日常生活不可或缺的一部分；日期和时间在计算机编程中经常使用。您可能需要使用 JavaScript 编写一个带有日历、火车时刻表或预约安排界面的网站。因此，出于此类目的，JavaScript 为我们提供了一些内置函数，例如getTime()返回自1970年1月1日00:00:00以来的毫秒数。

使用 toISOString() 方法

我们可能需要将秒转换为易于理解的格式化结构。假设我们正在使用 JavaScript 计算事件的持续时间，并且秒由一个很大的数字组成。在这种情况下，我们需要将秒转换为小时、分钟和秒格式。此方法是将秒转换为标准HH-MM-SS格式的最简单方法之一。

语法

用户可以遵循以下 toISOString() 方法的语法。

var calculatedTime = new Date( null );
calculatedTime.setSeconds( 5003 );
var newTime = calculatedTime.toISOString().substr( 11, 8 );

示例

以下示例演示了如何使用toISOString()方法将秒转换为HH-MM-SS格式，并使用原生 JavaScript。设置秒数并使用toISOString()方法后，返回一个长字符串，然后使用 JavaScript 的.substr()内置方法将其转换为子字符串，以便以 HHMM-SS 格式获取输出。

<html>
<body>
   <h2>Convert seconds to HH-MM-SS</h2>
   <h4>Using <i>toISOString()</i> method to convert 5003 seconds to HHMM-SS format.</h4>
   <div id = "container"></div>
</body>
   <script>
      var calculatedTime = new Date(null);
      calculatedTime.setSeconds( 5003 ); //setting value in seconds
      var newTime = calculatedTime.toISOString().substr(11, 8);
      document.getElementById("container").innerHTML = newTime;
   </script>
</html>

仅使用 Math.floor() 和一些数学逻辑

在这种方法中，我们将使用一些简单的数学逻辑和 JavaScript 提供的内置数学工具（如Math.floor()）将给定的秒转换为HHMM-SS格式。这将是首先想到的朴素方法。

语法

var hoursLeft = Math.floor( seconds / 3600 );
var min = Math.floor(( seconds - hoursLeft * 3600 ) / 60 );
var secondsLeft = seconds - hoursLeft * 3600 - min * 60;
secondsLeft = Math.round( secondsLeft * 100 ) / 100;

算法

  • 步骤 1 - 由于一小时由 3600 秒组成，因此可以通过将秒数乘以 3600 来计算小时数。这将揭示存在多少小时。

  • 步骤 2 - 使用 Math.floor() 方法将上一步的值向下取整。

  • 步骤 3 - 减去小时数后，找出剩余的秒数。通过将此数量除以 60 来确定分钟数。

  • 步骤 4 - 可以通过从之前提供的总秒数中减去分钟和小时的秒数来确定秒数。

示例

借助以下给出的示例，用户将能够轻松地借助一些简单的数学逻辑将秒转换为 HH-MM-SS 格式。

<html>
<body>
   <h2>Convert seconds to HH-MM-SS</h2>
   <h4>Using <i>Math.floor()</i> method.</h4>
   <div id = "container"></div>
</body>
   <script>
      var seconds = 129;
      var hoursLeft = Math.floor(seconds / 3600);
      var min = Math.floor((seconds - hoursLeft * 3600) / 60);
      var secondsLeft = seconds - hoursLeft * 3600 - min * 60;
      secondsLeft = Math.round(secondsLeft * 100) / 100;
      var answer = hoursLeft< 10 ? "0" + hoursLeft : hoursLeft;
      answer += ":" + (min < 10 ? "0" + min : min);
      answer += ":" + (secondsLeft< 10 ? "0" + secondsLeft : secondsLeft);
      document.getElementById("container").innerHTML = "129 seconds to time is : " + answer;
   </script>
</html>

本文介绍了将秒转换为HH-MM-SS格式最高效、省时且易于理解的方法。本文未介绍使用moment.js等外部库的较旧方法，因为像 Moment 这样的库是为 JavaScript 生态系统的先前时代构建的，而当前的 Web 状态则大不相同。

day.js、Luxon和Date-fns等库是 moment.js 的一些替代方案，可用于直接获取特定格式的时间。所有方法都能正常工作，但应根据用户的需求使用。

更新于： 2022年8月17日

4K+ 次查看

启动你的 职业生涯

通过完成课程获得认证

立即开始
广告