資料結構
網路
關係資料庫管理系統 (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+ 瀏覽量
