Make a clock with js

<!DOCTYPE html>
<html>
<head>
    <title>140</title>
    <meta charset="utf-8">
    <style type="text/css">
        h1{
            text-align: center;
        }

        hr
        {
            border: 2px solid black;
            margin: 20px;
        }

        div
        {
            text-align: center;
            margin:30px;
        }

        .w{
            border: 2px solid black;
            padding: 20px;
            margin: 20px;
            font-size: 120px;
        }

        .a{
            font-size: 140px;
            margin: 20px;
            font-family: 黑体;
        }
    </style>
    <script type="text/javascript">
        window.onload=function ()
        {
            var s,f,m;
            var ss,ff,mm;

            s=document.getElementById("s");
            f=document.getElementById("f");
            m=document.getElementById("m");

            There d;

            d=new Date();

            ss=d.getHours();
            ff=d.getMinutes();
            mm=d.getSeconds();

            s.innerText = ss;
            f.innerText = ff;
            m.innerText = mm;        

            function ac()
            {
                 mm++;
                 if(mm==60)
                 {
                     mm=0;
                     ff++;

                     if (ff==60) 
                     {
                         ff=0;
                         ss++;

                         if(ss==24)
                         {
                             ss=0;
                         }
                     }
                 }

                 if (ss<10) 
                 {
                     s.innerText="0"+ss;
                 }
                 else
                 {
                     s.innerText=ss;
                 }

                 if (ff<10) 
                 {
                     f.innerText="0"+ff;
                 }
                 else
                 {
                     f.innerText=ss;
                 }

                 if (mm<10) 
                 {
                     m.innerText="0"+mm;
                 }
                 else
                 {
                     m.innerText=mm;
                 }
            }        
            
                setInterval(ac, 1000);
        }
    </script>
</head>
<body>
   <h1>时钟</h1>
   <hr>

   <div>
        <span class="w" id="s">0</span>
        <span class="a">:</span>
        <span class="w" id="f">0</span>
        <span class="a">:</span>
        <span class="w" id="m">0</span>
   </div>
</body>
</html>

Guess you like

Origin blog.csdn.net/qq_39485970/article/details/82925850