2つの日付の差を計算したい | 日付・時間操作 | JavaScript 目的別リファレンス

スポンサーリンク

このプログラムでは、JavaScriptを使用して、2つの日付の差を計算し、その差を日数や時間数で表示する方法を紹介します。

スポンサーリンク

使用するオブジェクト: Dateオブジェクト

JavaScriptのDateオブジェクトを使うことで、日付を操作し、その差をミリ秒単位で計算できます。これを利用して、日数や時間数などの具体的な差を求めることができます。

2つの日付の差を日数・時間数で表示するプログラム

以下のコードでは、2つの日付の差を計算し、その差を日数と時間数で表示しています。

HTMLとJavaScriptコード

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>2つの日付の差を計算する方法</title>
</head>
<body>

    <div id="dateDifference"></div>

    <script>
        window.onload = function() {
            // 2つの日付を定義
            const date1 = new Date('2023-09-01T00:00:00'); // 任意の日付
            const date2 = new Date(); // 現在の日付

            // 2つの日付の差をミリ秒単位で計算
            const diffInMilliseconds = date2 - date1;

            // ミリ秒を日数と時間数に変換
            const diffInDays = Math.floor(diffInMilliseconds / (1000 * 60 * 60 * 24)); // 日数
            const diffInHours = Math.floor(diffInMilliseconds / (1000 * 60 * 60)) % 24; // 時間数

            // 結果をHTMLに表示
            document.getElementById('dateDifference').innerHTML = `
                <p>日付1: ${date1.toDateString()}</p>
                <p>日付2: ${date2.toDateString()}</p>
                <p>2つの日付の差は ${diffInDays} 日と ${diffInHours} 時間です。</p>
            `;
        }
    </script>

</body>
</html>

プログラムの解説

JavaScriptのDateオブジェクトを使用して、2つの日付のミリ秒単位での差を計算し、その差を日数や時間数に変換しています。getTime()メソッドや直接的な日付の引き算により、ミリ秒での差を取得できます。その後、計算結果を日数や時間数に換算するために、ミリ秒を1000 * 60 * 60 * 24で割って変換しています。

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

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