数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法学如何在 JavaScript 中以 12 小时 AM/PM 格式显示日期时间？
为了高效的时间分析，最实用的日期时间显示方式是 12 小时 am/pm 格式。此外，这种方法可以清楚地区分上午和下午。例如，“am/pm” 都指定了特定时间段，并且易于理解时间，而 24 小时制则不然。
本文将解释如何以 12 小时 am/pm 格式显示 JavaScript 日期时间。
以 12 小时 am/pm 格式显示 JavaScript 日期时间
让我们逐一深入了解如何以 12 小时 am/pm 格式显示 JavaScript 日期时间。我们可以从当前日期时间中提取小时和分钟。如果小时值大于 12，则为 PM，否则为 AM。
使用 toLocaleString() 方法
toLocaleString() 方法返回一个字符串，该字符串根据使用的语言表示日期。计算机上的区域设置决定默认语言。
语法
以下是 toLocaleString() 的语法：
Date.toLocaleString(locales, options)
示例
在下面的示例中，我们创建了一个新的日期对象并使用美国语言格式应用 toLocaleString() 方法，并将时间值分配为其参数。我们使用 hour12 来指示时间应以 12 小时格式显示。
<!DOCTYPE html>
<html>
<body>
<script>
var time = new Date();
document.write(time.toLocaleString('en-US', {
hour: 'numeric',
minute: 'numeric',
hour12: true
}));
</script>
</body>
</html>
脚本执行时，将生成一个输出，其中包含脚本执行触发的事件导致的 12 小时格式 am/pm 显示的时间。
示例
考虑以下示例，这里我们创建了一个新的日期对象并应用 toLocaleString()，并以 12 小时格式 (am/pm) 以及完整的日期在网页上获取输出。
<!DOCTYPE html>
<html>
<body>
<button onclick="displaydatetime()">Click</button>
<p id="tutorial"></p>
<script>
function displaydatetime() {
var x = new Date();
var y = x.toLocaleString([], {
hour12: true
});
document.getElementById("tutorial").innerHTML = y;
}
</script>
</body>
</html>
运行上述脚本后，将弹出输出窗口，在网页上显示单击按钮。当用户单击按钮时，事件被触发，并在网页上以 12 小时 am/pm 格式显示日期时间。
示例
执行以下操作以获取 12 小时 am/pm 格式的 JavaScript 日期时间。
<!DOCTYPE html>
<html>
<body>
<p id="tutorial"></p>
<script>
const date = new Date();
document.getElementById("tutorial").innerHTML = date.toLocaleString();
</script>
</body>
</html>
运行上述脚本时，将出现一个输出窗口，触发事件并在网页上以 12 小时 am/pm 格式显示日期时间。
使用内联函数
这可以通过将条件运算符应用于日期时间 am/pm 格式来实现。
示例
让我们看下面的例子，这里我们创建一个名为 dateTimeformat() 的内联函数，并创建一个变量 x，并根据小时的值分配 am 或 pm。我们使用 % 运算符将小时转换为 12 小时格式。
<!DOCTYPE html>
<html>
<body>
<script>
const dateTimeformat = (date) => {
let hours = date.getHours();
let minutes = date.getMinutes();
let x = hours >= 12 ? 'pm' : 'am';
hours = hours % 12;
hours = hours ? hours : 12;
minutes = minutes.toString().padStart(2, '0');
let mergeTime = hours + ':' + minutes + ' ' + x;
return mergeTime;
}
document.write(dateTimeformat(new Date()));
</script>
</body>
</html>
脚本执行时，事件被触发，并在网页上以 12 小时 am/pm 格式显示时间。
3K+ 浏览量
