얼렁뚱땅코드/jquery

자동으로 시간 돌아가게 해주기

얼렁뚱땅 디자이너 2019. 9. 27. 22:22
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="reset.css">
    <link rel="stylesheet" href="/css/swiper.css">
    <style>

    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="/js/swiper.js"></script>
    <script>
        $(function () {

            //자동으로 시간이 돌아가게 해준다.
            setInterval(function () {
                var date = new Date();
                //document.write(date);

                var h = date.getHours(); //h라는 변수에 시간을 넣어라
                var m = date.getMinutes(); //m라는 변수에 분을 넣어라
                var s = date.getSeconds(); //s라는 변수에 초을 넣어라

                $('span').eq(0).text(h);//span의 0번째에 h값을 넣어라
                $('span').eq(1).text(m);//span의 1번째에 m값을 넣어라
                $('span').eq(2).text(s);//span의 2번째에 s값을 넣어라
            }, 1000);

        })
    </script>
</head>

<body>
    <p>
        <span>00</span>:
        <span>00</span>:
        <span>00</span>
    </p>
</body>

</html>