美文网首页
用js在网页上显示一个钟表

用js在网页上显示一个钟表

作者: Echo112233 | 来源:发表于2017-05-11 15:48 被阅读651次

    用js在网页上显示一个钟表:

    方法1:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <script>
    function startTime(){
        var today=new Date();
        var h=today.getHours();
        var m=today.getMinutes();
        var s=today.getSeconds();// 在小于10的数字钱前加一个‘0’
        m=checkTime(m);
        s=checkTime(s);
        document.getElementById('txt').innerHTML=h+":"+m+":"+s;
        t=setTimeout(function(){startTime()},500);
    }
    function checkTime(i){
        if (i<10){
            i="0" + i;
        }
        return i;
    }
    </script>
    </head>
    <body onload="startTime()">
        
    <div id="txt"></div>
        
    </body>
    </html>
    

    方法2:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <p>在页面显示一个时钟</p>
    <p id="demo"></p>
    <script>
    var myVar=setInterval(function(){myTimer()},1000);
    function myTimer(){
        var d=new Date();
        var t=d.toLocaleTimeString();
        document.getElementById("demo").innerHTML=t;
    }
    </script>
    
    </body>
    </html>
    

    文章来自:http://www.runoob.com/js/js-obj-date.html
    http://www.runoob.com/js/js-timing.html

    相关文章

      网友评论

          本文标题:用js在网页上显示一个钟表

          本文链接:https://www.haomeiwen.com/subject/iiiotxtx.html