欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JavaScript之动态显示时间代码实现

程序员文章站 2022-07-18 10:12:23
动态显示时间 第一步:得到当前时间。 第二步:格式化当前时间。 第三步:获取标签。 第四步:使用innerhtml属性向标签里写入时间。 第五步:使用定时器每一秒向标签里写入时间。 setinter...

动态显示时间

第一步:得到当前时间。

第二步:格式化当前时间。

第三步:获取标签。

第四步:使用innerhtml属性向标签里写入时间。

第五步:使用定时器每一秒向标签里写入时间。

setinterval("方法名;",每隔几秒执行一次)

示例:

<!doctype html>  
<html>  
    <head>  
        <meta charset="utf-8">  
        <title>动态时间显示</title>  
        <style type="text/css">  
            #pid {  
                width: 200px;  
                height: 150px;  
                border: 2px dashed chartreuse;  
            }  
        </style>  
    </head>  
    <body>  
        <p id="pid">  
              
        </p>  
        <script type="text/javascript">  
            function getdate(){  
                //获取时间  
                var date = new date();  
                //格式化时间  
                var time = date.tolocalestring();  
                //获取p标签  
                var p1 = document.getelementbyid("pid");  
                //向p标签里写入时间  
                p1.innerhtml = time;  
            }  
            //每隔一秒设置一次  
            setinterval("getdate();",1000);  
        </script>  
    </body>  
</html>