時刻を丸めたい | 日付・時間操作 | JavaScript 目的別リファレンス

このプログラムでは、JavaScriptを使用して時刻を15分ごとに切り上げています。Math.ceil()を使用してミリ秒単位で丸め、15分の倍数になるように時刻を調整しています。

INDEX

使用する関数: Math.ceil()
時刻を丸めるプログラム
1. HTMLとJavaScriptコード
2. プログラムの解説
Dateオブジェクトメソッドの機能一覧
Mathオブジェクトメソッドの機能一覧

使用する関数: Math.ceil()

Math.ceil()は、指定した値を切り上げて次の整数を返します。ここでは、ミリ秒単位の計算で使用し、指定した時間間隔（例：15分）の倍数に切り上げています。

時刻を丸めるプログラム

以下のコードでは、現在の時刻を15分ごとに切り上げた時刻を表示しています。

HTMLとJavaScriptコード

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>時刻を丸める方法（例：15分ごとに切り上げ）</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 now = new Date();

            // 時刻を丸める関数（例：15分ごとに切り上げ）
            function roundTime(date, minutes) {
                const ms = 1000 * 60 * minutes; // ミリ秒単位の分数
                return new Date(Math.ceil(date.getTime() / ms) * ms);
            }

            // 15分ごとに切り上げた時刻を計算
            const roundedTime = roundTime(now, 15);

            // 結果をHTMLに表示
            document.getElementById('roundedTime').textContent = `丸めた時刻: ${roundedTime.toLocaleTimeString()}`;
        }
    </script>
</head>
<body>

    <h1>時刻を丸める方法（例：15分ごとに切り上げ）</h1>

    <div id="roundedTime"></div>

</body>
</html>