다음은 date() 메소드를 출력하는 코드와 출력화면 이다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="author" content="Developer N">
<title>date methode</title>
<script>
setInterval(function () { // 일정한 시간 간격으로 작업을 반복 실행
var date = new Date(); // Data() 객체 생성
document.body.innerHTML = date; // date 전체 요소 출력
}, 1000); // 1초 간격
</script>
</head>
<body>
</body>
</html>
Thu Oct 24 2019 20:14:11 GMT+0900 (한국 표준시)
그런데 위의 화면처럼 연도, 날자, 시간 등을 전부 사용하기 보다는 필요한 부분만 골라서 사용하는 경우가 있다.
이럴경우 각각의 요소들은 어떻게 출력하는지 알아본다.
다음 코드는 년, 월, 일, 시, 분, 초를 각각 분리하여 추출하는 방법을 나타내고 있다.
출력은 편의상 추출된 데이터를 전부 팝쳐서 한번에 출력하고 있다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="author" content="Developer N">
<title>date methode</title>
<script>
setInterval(function () { // 일정한 시간 간격으로 작업을 반복 실행
var date = new Date(); // Data() 객체 생성
var currenYear = date.getFullYear(); // Year 추출
var currenMonth = ( date.getMonth() + 1 ); // Month 추출
var currenDate = date.getDate(); // Date 추출
var currentHours = date.getHours(); // Hours 추출
var currenMinutes = date.getMinutes(); // Minutes 추출
var currenSeconds = date.getSeconds(); // Seconds 추출
var dateAll = date + "<br />" + // 출력 data 편집
currenYear+"년 <br />" +
currenMonth+"월 <br />" +
currenDate+"일 <br />" +
currentHours+"시 <br />" +
currenMinutes+"분 <br />" +
currenSeconds+"초 <br />" +
"입니다." ;
document.body.innerHTML = dateAll; // dateAll 출력
}, 1000); // 1초 간격
</script>
</head>
<body>
</body>
</html>
출력된 화면은 다음과 같다.
Thu Oct 24 2019 20:52:05 GMT+0900 (한국 표준시)
2019년
10월
24일
20시
52분
5초
입니다.
일부분만 사용할 경우 필요한 부분만 적절하게 편집하여 사용하면 된다.