日歷
在 HTML5 中,我們可以使用新的日期時間輸入控件輕松創建日歷。
以下是一個簡單的示例:
<input type="date" id="myDate">
上面的代碼將創建一個日期選擇器,用戶可以通過單擊輸入框來選擇日期。
如果您想將所選日期直接顯示在網頁上,則需要使用 JavaScript。
以下是使用 JavaScript 顯示日期的完整代碼:
<html> <head> <title>HTML5 日歷網頁</title> <script> function showDate() { var currentDate = document.getElementById("myDate").value; document.getElementById("dateDisplay").textContent = currentDate; } </script> </head> <body> <h1>日歷</h1> <input type="date" id="myDate" onchange="showDate()"> <p>您選擇的日期是: <span id="dateDisplay"></span></p> </body> </html>
上面的代碼將創建一個日期選擇器,并使用 onchange 事件將所選日期顯示在網頁上。
在 HTML5 中創建日歷非常簡單。使用新的日期時間輸入控件以及 JavaScript,您可以創建交互性更強的日歷應用程序。