日付をヨーロッパ式にフォーマットしたい | 日付・時間操作

日付をヨーロッパ式にフォーマットしたい | 日付・時間操作 | JavaScript 目的別リファレンス

目的別リファレンス

2024.09.23

このプログラムでは、日付をヨーロッパ式のフォーマット（DD/MM/YYYY）に変換して表示します。

使用するメソッド: getDate(), getMonth(), getFullYear()
日付をヨーロッパ式にフォーマットするプログラム
1. HTMLとJavaScriptコード
2. プログラムの解説
Dateオブジェクトメソッドの機能一覧

使用するメソッド: getDate(), getMonth(), getFullYear()

このプログラムでは、getDate()、getMonth()、getFullYear()メソッドを使用して日付、月、年を取得し、それをヨーロッパ式にフォーマットします。

日付をヨーロッパ式にフォーマットするプログラム

以下のコードでは、今日の日付をDD/MM/YYYY形式にフォーマットして表示しています。

HTMLとJavaScriptコード

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>日付をヨーロッパ式（DD/MM/YYYY）にフォーマットする方法</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() {
            // 日付をヨーロッパ式（DD/MM/YYYY）にフォーマットする関数
            function formatDateToEuropean(date) {
                const day = String(date.getDate()).padStart(2, '0');
                const month = String(date.getMonth() + 1).padStart(2, '0'); // 月は0から始まるので+1
                const year = date.getFullYear();
                return `${day}/${month}/${year}`;
            }

            // 今日の日付をフォーマット
            const today = new Date();
            const formattedDate = formatDateToEuropean(today);

            // 結果をHTMLに表示
            document.getElementById('formattedDate').textContent = `今日の日付（ヨーロッパ式）: ${formattedDate}`;
        }
    </script>
</head>
<body>

    <h1>日付をヨーロッパ式（DD/MM/YYYY）にフォーマットする方法</h1>

    <div id="formattedDate"></div>

</body>
</html>