在前端开发中，我们常常需要在网页中显示日期时间。而对于英语语系中的时间表示方式，AM和PM是最为常见的。
在JavaScript中，Date对象提供了获取当前日期时间、转换成指定格式等功能。那么如何在JavaScript中将日期时间格式化为12小时制的AM/PM格式呢？接下来，我将详细介绍一种实现方式。
步骤1：获取当前日期时间
首先，我们需要使用JavaScript的Date对象获取当前的日期时间。可以使用以下代码：
const now = new Date();
此时，now变量存储的就是当前的日期时间信息。
步骤2：设置AM/PM格式
接下来，我们需要将日期时间格式化为12小时制的AM/PM格式。这可以通过以下步骤实现：
- 首先，获取当前小时数，即
now.getHours()。 - 判断当前小时数是否大于12。如果大于12，则减去12，并设置为PM；否则，设置为AM。
- 如果当前小时数为0，则设置为12。
可以使用以下代码实现以上步骤：
let hours = now.getHours(); let ampm = hours >= 12 ? 'PM' : 'AM'; hours %= 12; hours = hours ? hours : 12;
此时，ampm变量存储的就是当前时间的AM/PM标识，hours变量存储的则是当前时间的小时数（12小时制）。
步骤3：格式化日期时间字符串
最后，我们需要将日期时间格式化为指定的格式。可以使用以下代码实现：
const minutes = now.getMinutes();
const seconds = now.getSeconds();
const timeString = `${hours}:${minutes < 10 ? '0' + minutes : minutes}:${seconds < 10 ? '0' + seconds : seconds} ${ampm}`;以上代码中，timeString变量存储的就是格式化后的日期时间字符串。
完整示例代码如下所示：
-- -------------------- ---- ------- ----- --- - --- ------- --- ----- - --------------- --- ---- - ----- -- -- - ---- - ----- ----- -- --- ----- - ----- - ----- - --- ----- ------- - ----------------- ----- ------- - ----------------- ----- ---------- - ------------------- - -- - --- - ------- - ------------------ - -- - --- - ------- - -------- --------- ------------------------ -- ------------ --
通过以上代码，我们可以在控制台中看到当前的日期时间以12小时制的AM/PM格式进行显示。
总结： 本文介绍了如何在JavaScript中将日期时间格式化为12小时制的AM/PM格式。通过获取当前时间信息、判断小时数并设置AM/PM标识、格式化日期时间字符串等步骤，我们可以轻松地实现该功能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/9408
