实时打印时间

最新推荐文章于 2022-04-07 16:52:54 发布

还不下马受降

最新推荐文章于 2022-04-07 16:52:54 发布

阅读量147

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/weixin_43865846/article/details/116385312

版权

JS 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

new一个Date()，setInterval()每隔一秒执行一次读取时间的函数，并innerHTML到屏幕上。很简单，但是会觉得挺有意思。
每秒更新一次

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <style>

        body {
             display:flex;
             justify-content: center;

        }
        #time{
            display: flex;
             height: 500px;
            width: 80%;
            background-color: wheat; 
            justify-content: center;
             align-items: center;
 
           
        }
        p{
           
             background-color: skyblue;
             font-size: 50px;
             display: inline-block;
             margin: auto;
             

        }
    </style>
</head>
<body>
      <div id="time">
            <p id="ts">time</p>
      </div>
</body>



<script>
 
 var d = new Date();
 console.log(d);
 function gettime(){

      var t = new Date();
      var tt=  document.getElementById("ts");
       tt.innerHTML=t;
      
 }

   setInterval(() => {
       gettime();
       
     }, 1000);

</script> 
</html>

在这里插入图片描述

还不下马受降

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
实时打印时间

new一个Date()，setInterval()每隔一秒执行一次读取时间的函数，并innerHTML到屏幕上。很简单，但是会觉得挺有意思。每秒更新一次<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> .
复制链接

扫一扫

专栏目录