날짜 및 시간을 표시하는 간단한 HTML 코드를 제공합니다. 이 코드는 초보자도 이해하기 쉽도록 주석이 추가되어 있습니다.
<!DOCTYPE html>
<html>
<head>
<title>날짜 및 시간 표시</title>
</head>
<body>
<h1>현재 날짜와 시간</h1>
<!-- 날짜 및 시간 표시 영역 -->
<p>현재 날짜: <span id="currentDate"></span></p>
<p>현재 시간: <span id="currentTime"></span></p>
<script>
// 현재 날짜와 시간 표시 함수
function displayDateTime() {
var currentDateElement = document.getElementById("currentDate");
var currentTimeElement = document.getElementById("currentTime");
var now = new Date();
var dateOptions = { year: 'numeric', month: 'long', day: 'numeric' };
var timeOptions = { hour: '2-digit', minute: '2-digit', second: '2-digit' };
currentDateElement.textContent = now.toLocaleDateString(undefined, dateOptions);
currentTimeElement.textContent = now.toLocaleTimeString(undefined, timeOptions);
}
// 페이지 로드 시 현재 날짜와 시간 표시
window.onload = displayDateTime;
</script>
</body>
</html>
'HTML 예제' 카테고리의 다른 글
화면 크기에 따른 반응형 디자인 (0) | 2023.12.07 |
---|---|
간단한 게시판 형식 (0) | 2023.12.07 |
다크 모드 토글 (0) | 2023.12.07 |
사용자 위치 표시 (0) | 2023.12.07 |
동적으로 목록 추가 (0) | 2023.12.07 |