获取当前（日期，时间）实时变动。

最新推荐文章于 2023-07-01 15:46:05 发布

邱志刚

最新推荐文章于 2023-07-01 15:46:05 发布

阅读量513

点赞数 1

分类专栏： js技术文章标签： javascript

本文链接：https://blog.csdn.net/qq_42957741/article/details/103783740

版权

js技术专栏收录该内容

41 篇文章 1 订阅

订阅专栏

在这里插入图片描述

<!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>
</head>
<style>
    *{
        margin: 0;
        padding: 0;
        list-style: none;
    }
    html{
      
    }
    #box{
        width: 400px;
        height: 500px;
        background: orange;
        border-radius: 15px;
        margin:40px auto;
        box-sizing: content-box;
        overflow: hidden;
        text-align: center;
    }
    p{
        font-size: 25px;
        margin: 15px 0px;
        cursor: pointer;
    }
    #center{
        width: 200px;
        height: 200px;
        background: orangered;
        border-radius: 8px;
        margin: 100px 100px;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 50px;
        color: palegoldenrod;
        cursor: pointer;
    }

</style>
<body>
    <div id="box">
       <p id="time"></p>
       <p id="week"></p>        
        <div id="center">
           
        </div>
    </div>
    
    <script>
  function time(){

        var date = new Date();        // 实例化时间
        var y = date.getFullYear();   // 年
        var m = date.getMonth();    // 月
        var d  = date.getDate();       // 日
        var week = date.getDay();     // 星期几
        var tet = date.getHours();    // 小时
        var min = date.getMinutes();  // 分
        var s  = date.getSeconds();   // 秒
        var weeke = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六',];
        // console.log(y,m,d,week,tet,min,s);
        let mmt = weeke[week];
        let mont=``; 
        let day = `<h2>${d}</h2>`
        $('time').innerHTML=`${y}年${m}月${d}日${tet}时${min}分${s}秒`;
        $('week').innerHTML=`<p>${mmt}</p>`;
        $('center').innerHTML = `<h2>${d}日</h2>`;
  }
  setInterval(() => {
      time();
  }, 1000);

  //封装id选择器，
    function $(id){
        return typeof id ==='string' ? document.getElementById(id):null;
    }
    
    </script>
</body>
</html>

2019年最后一天，各位加油，希望2020年的我们能够更好，都能实现自己的梦想。