タイムゾーンを指定して特定の時刻を取得したい | 日付・時間操作 | JavaScript 目的別リファレンス

現在作成中です。今後加筆修正してまいります。
スポンサーリンク

このプログラムでは、JavaScriptのtoLocaleString()メソッドを使用して、特定のタイムゾーンに基づいた現在の時刻を取得します。timeZoneオプションを使うことで、さまざまなタイムゾーンに対応した時間表示が可能です。

スポンサーリンク

使用するメソッド: toLocaleString()

toLocaleString()メソッドは、指定されたロケールとオプションに基づいて日付と時刻を文字列として返します。timeZoneオプションを指定することで、世界中の異なるタイムゾーンの時刻を取得することができます。

タイムゾーンを指定して時刻を取得するプログラム

以下のコードでは、タイムゾーン「America/New_York」に基づいた現在の時刻を表示しています。

HTMLとJavaScriptコード

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>タイムゾーンを指定して特定の時刻を取得する方法</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            line-height: 1.6;
            padding: 20px;
        }
        pre {
            background: #f4f4f4;
            border-left: 3px solid #ccc;
            padding: 10px;
            margin: 20px 0;
        }
    </style>

    <script>
        window.onload = function() {
            // タイムゾーンを指定して現在時刻を取得する
            const currentDate = new Date();

            // タイムゾーンを指定して日時を取得
            const options = { timeZone: 'America/New_York', hour12: false, year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' };
            const newYorkTime = currentDate.toLocaleString('ja-JP', options);

            // 結果をHTMLに表示
            document.getElementById('newYorkTime').textContent = `ニューヨークの現在時刻: ${newYorkTime}`;
        }
    </script>
</head>
<body>

    <h1>タイムゾーンを指定して特定の時刻を取得する方法</h1>

    <div id="newYorkTime"></div>

</body>
</html>

プログラムの解説

このプログラムでは、toLocaleString()メソッドを使用して、指定されたタイムゾーンの時刻を取得しています。タイムゾーンはtimeZoneオプションで指定し、日時フォーマットはyearmonthdayhourminutesecondを設定しています。

世界のタイムゾーン

タイムゾーン名 地域
America/New_York 米国東部標準時(EST)
Europe/London イギリス(GMTまたはBST)
Asia/Tokyo 日本標準時(JST)
Australia/Sydney オーストラリア東部標準時(AEST)
Asia/Dubai アラビア標準時(GST)
America/Los_Angeles 米国太平洋標準時(PST)
Europe/Berlin 中央ヨーロッパ標準時(CET)
Asia/Kolkata インド標準時(IST)
Africa/Cairo 東ヨーロッパ標準時(EET)

Dateオブジェクト メソッドの機能一覧

Dateオブジェクト メソッドの機能一覧 | JavaScript リファレンス
JavaScriptのDateオブジェクトは、日時を操作するために使用されるオブジェクトです。以下に、Dateオブジェクトのメソッドを種類ごとにアルファベット順にまとめています。 Dateオブジェクトのインスタンスメソッド メソッド名 説明と注意点 getDate() 日(1~31)を取得。 注意点: 月初や月末の値に...