자바스크립트 현재 시간 출력 - jabaseukeulibteu hyeonjae sigan chullyeog

Question

자바스크립트 현재 날짜 시간 구하기 ( yyyyMMddhhmmss )

javascript를 통해 예제를 "년월일시분초"를 구하는 function example코드를 만들어 보겠습니다.

1. yyyyMMddhhmmss 형식의 string 데이터 반환 ( EX : 20210324112500 )

    function getCurrentDate()
    {
        var date = new Date();
        var year = date.getFullYear().toString();

        var month = date.getMonth() + 1;
        month = month < 10 ? '0' + month.toString() : month.toString();

        var day = date.getDate();
        day = day < 10 ? '0' + day.toString() : day.toString();

        var hour = date.getHours();
        hour = hour < 10 ? '0' + hour.toString() : hour.toString();

        var minites = date.getMinutes();
        minites = minites < 10 ? '0' + minites.toString() : minites.toString();

        var seconds = date.getSeconds();
        seconds = seconds < 10 ? '0' + seconds.toString() : seconds.toString();

        return year + month + day + hour + minites + seconds;
    }

2. yyyyMMdd 형식의 string 데이터 반환 ( EX : 20210324 )

위에서 시분초 부분만 빼주면 되겠죠?

    function getCurrentDate()
    {
        var date = new Date();
        var year = date.getFullYear().toString();

        var month = date.getMonth() + 1;
        month = month < 10 ? '0' + month.toString() : month.toString();

        var day = date.getDate();
        day = day < 10 ? '0' + day.toString() : day.toString();

        return year + month + day ;
    }

여기서 yyyy-mm-dd 형식으로 가져와야 한다고 하면 조금만 수정하면 됩니다.

return 하는 부분에서 이런식으로도 수정 할수 있겠네요.

 return year + '-'+ month + '-'+ day ;

자바스크립트 날짜 빼기 ( yyyymmdd - yyyymmdd )

자바스크립트 날짜 빼기 ( yyyymmdd - yyyymmdd ) 자바스크립트를 이용해 날짜 뺴기를 해야할 경우가 이럴때 사용하면 참 편리하다. 아래는 두 날짜 간의 차이가 몇 일인지 계산하는 자바스크립

www.appletong.com

자바스크립트 시간 계산 초단위 뺄셈 ( yyyymmddhhmmss 형식 )

자바스크립트 시간 계산 초단위 뺄셈 ( yyyymmddhhmmss 형식 ) 자바스크립트를 이용해서 현재 시간 기준으로 몇 초가 흘렀는지 뺄셈 계산을 할 때 사용하면 참으로 좋다. 파라미터 인자

www.appletong.com

자바 String 원하는 문자열 추출 (indexOf, subString, chatAt, token, parseInt )

자바 String 원하는 문자열 추출 정리 자바 String 관련해서 자르고 추출하고, 있는지 검사에 대한 자주쓰는 기본 메서드에 대해 정리한다. indexOf(String a) = a의 문자의 위치 값을 숫자를 얻는다.

www.appletong.com

개발환경 : Windows10, VScode

안녕하세요 이번 시간에는 자바스크립트로 html문서에 실시간으로 시간을 표시하는 방법에 대해 알려드리도록 하겠습니다. 화면에는 월, 일, 요일을 표시하고 시, 분, 초에서 수가 한자리 수면 0을 채워줘서 두 자릿수로 표현하도록 하였습니다.

<clock1.html>

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>clock1</title>
</head>
<body>
    <h2 id="clock" style="color:black;">clock</h2>
    
    <script>
        var Target = document.getElementById("clock");
        function clock() {
            var time = new Date();

            var month = time.getMonth();
            var date = time.getDate();
            var day = time.getDay();
            var week = ['일', '월', '화', '수', '목', '금', '토'];

            var hours = time.getHours();
            var minutes = time.getMinutes();
            var seconds = time.getSeconds();

            Target.innerText = 
            `${month + 1}월 ${date}일 ${week[day]}요일 ` +
            `${hours < 10 ? `0${hours}` : hours}:${minutes < 10 ? `0${minutes}` : minutes}:${seconds < 10 ? `0${seconds}` : seconds}`;
                
        }
        clock();
        setInterval(clock, 1000); // 1초마다 실행
    </script>
</body>
</html>

new Date() 를 통해 현재 날짜와 시간이 저장된 Date 객체를 생성하고
월, 일, 요일, 시,분,초 데이터들을 변수로 저장합니다.

Document.getElementById("clock")를 통해 문서 내 "clock" id 속성을 가진 요소를 Target으로 저장하고
innerText를 통해 Target의 text값 부분에 표현하고자 하는 값을 출력합니다.

그리고 setInterval(clock,1000) 을 통해 1초 간격으로 함수를 실행합니다.

다른 방식으로도 디자인해서 한번 출력해봤습니다.

<clock2.html>

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>clock2</title>
</head>
<body>

    <div style="text-align: center;">
        <span id="clock" style="color:gray; font-size: 100px;">clock</span>
        <span id="apm" style="color:gray; font-size: 50px;"  >ampm</span>
    </div>
    

    <script>
        var Target = document.getElementById("clock");
        var Target_apm = document.getElementById("apm");
        function clock() {
            var time = new Date();
            var hours = time.getHours();
            var minutes = time.getMinutes();
            var seconds = time.getSeconds();
            var AmPm ="AM";
            if(hours > 12){   
                var AmPm ="PM";
                hours %= 12;
            }

            Target.innerText = 
            `${hours < 10 ? `0${hours}` : hours}:${minutes < 10 ? `0${minutes}` : minutes}:${seconds < 10 ? `0${seconds}` : seconds}`;

            Target_apm.innerText = `${AmPm}`;

        }
        clock();
        setInterval(clock, 1000); // 1초마다 실행
    </script>
</body>
</html>

자바스크립트 현재시간 포맷 자바스크립트 현재날짜 yyyymmdd 자바스크립트 현재시간 밀리초 javascript 현재시간 yyyymmddhhmmss 자바스크립트 시간 계산 html 현재시간 출력