js动态显示时间

最新推荐文章于 2022-04-17 11:55:35 发布

原创最新推荐文章于 2022-04-17 11:55:35 发布 · 236 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js #动态显示时间

WEB前端专栏收录该内容

32 篇文章

订阅专栏

本文介绍了一个简单的JavaScript程序，用于在网页上动态显示当前时间。通过使用HTML和JavaScript结合，每秒更新页面上的时间显示。

1.html代码

<!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>js动态显示时间</title>    
    <script src="./time_display.js"></script>
</head>
<body onload="show()">
    

    <div>
       当前时间: <p id="time"></p>
    </div>
    
</body>
</html>

2.js代码

function show()
{
    var now = new Date();
    var h = now.getHours();
    var m = now.getMinutes();
    var s = now.getSeconds();
    h = check(h);
    m = check(m);
    s = check(s);
    var obj = document.getElementById("time");
    obj.innerHTML = h + ":" + m + ":" + s;
    setTimeout("show()", 1000);
}

function check(x)
{
    return x < 10 ? "0" + x : x;
}