显示当前时间——javascript

网页上显示日期时间，就只需要创建一个Date对象，我们就可以完成时间的实现，但这个时间却是固定的。那是因为当页面加载完数据之后，这个时间就是固定的了，所以我们要每秒显示一次时间，这样时间就能实时更新了。

核心代码

//设置定时器     
setInterval(function() {
    document.getElementById("nowTime").innerHTML = getNowTime()
}, 1000)

是不是很简单，这就是一个定时器，通过每过一秒显示一次时间，这样就可以更新时间了

完整代码

<!DOCTYPE html>
<html>
<head>
    <title>显示当前时间</title>
</head>
<script type="text/javascript">
    window.onload  = () => {
        //设置星期数
        const getWeekDay = (week) => {
            weekday = null
            if(week == "1") {
                weekday == "星期一"
            }
            else if (week == "2") {
                weekday = "星期二"
            }
            else if (week == "3") {
                weekday = "星期三"
            }else if (week == "4") {
                weekday == "星期四"
            }else if (week == "5") {
                weekday = "星期五"
            }else if (week == "6") {
                weekday = "星期六"
            }else if(week == "7") {
                weekday = "星期日"
            } 
            return weekday
        }
        const getNowTime = () => {
            //获取当前时间
            var date = new Date()
            //设置日期格式
            var nowtime = date.getFullYear() + "年"
                + (date.getMonth() + 1) + "月"
                + date.getDate() + "日"
                + "<br/>"
                + getWeekDay(date.getDay())
                + "<br/>"
                + date.getHours() + ":"
                + date.getMinutes() + ":"
                + date.getSeconds()
            return nowtime
        }
        //设置定时器，每过一秒显示当前时间
        setInterval(function() {
            document.getElementById("nowTime").innerHTML = getNowTime()
        }, 1000)
    }
</script>
<body>
    <h2>显示当前时间</h2>
    <p id="nowTime"></p>
</body>
</html>

显示当前时间——javascript

猜你喜欢