利用JavaScript实现系统当前时间小案例

大锐爱学习

已于 2022-12-23 12:20:03 修改

阅读量144

点赞数

分类专栏： JavaScript 文章标签： javascript 前端开发语言

于 2022-12-23 12:05:44 首次发布

本文链接：https://blog.youkuaiyun.com/m0_60859997/article/details/128418169

版权

JavaScript 专栏收录该内容

2 篇文章

订阅专栏

这篇博客提供了一段JavaScript代码，用于在网页上实时显示当前的日期、时间及星期。代码中定义了一个名为getTime()的函数，该函数获取当前日期并格式化输出，包括年、月、日、小时、分钟、秒以及星期。通过设置定时器，这个信息会每秒钟更新一次。这是一个基础的时间显示实践案例，适用于前端开发学习。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

废话不多说，直接上代码，复制过去直接用。

<body>
    <div></div>
</body>

<script>
    // 页面显示时间小案例
    let arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六',]
    // 获取页面上需要展示时间的标签元素
    let div = document.querySelector('div')
    //    调用声明的函数
    getTime()
    // 创建定时器，每1秒钟执行一次
    setInterval(getTime, 1000)
    // 声明函数
    function getTime() {
        let date = new Date()
        let year = date.getFullYear()
        let getMonth = date.getMonth() + 1
        let date1 = date.getDate()
        let hour = date.getHours()
        hour = hour < 10 ? '0' + hour : hour
        let min = date.getMinutes()
        min = min < 10 ? '0' + min : min
        let sec = date.getSeconds()
        sec = sec < 10 ? '0' + sec : sec
        let day = date.getDay()
        div.innerHTML = `今天是：${year} 年${getMonth}月
        ${date1}日 ${hour}:${min}:${sec} ${arr[day]}`
    }
</script>