关键词

js显示时间 js显示最后修改时间

下面是关于“js显示时间 js显示最后修改时间”的详细讲解及示例:

一、JS显示时间

1. 在HTML页面上显示当前时间

我们可以使用以下JavaScript代码来在HTML页面上显示当前时间:

<p id="time"></p>
<script>
    var now = new Date();
    var hour = now.getHours();
    var minute = now.getMinutes();
    var second = now.getSeconds();

    document.getElementById("time").innerHTML = hour + ":" + minute + ":" + second;
</script>

上述代码的意思是,首先获取当前时间(使用new Date()对象),然后分别获取时、分、秒(使用getHours()getMinutes()getSeconds()方法),最后使用JavaScript将这些时间拼接为一个字符串,并将其显示在HTML页面的<p>标签中(使用innerHTML属性)。

我们可以将上述代码保存为一个HTML文件,并在浏览器中打开,就可以看到当前时间的显示效果。

2. 实时更新时间的显示

上面的示例代码只会在页面初次加载时显示当前时间,如果我们希望实时更新时间的显示,可以使用以下代码:

<p id="time"></p>
<script>
    function updateTime() {
        var now = new Date();
        var hour = now.getHours();
        var minute = now.getMinutes();
        var second = now.getSeconds();

        document.getElementById("time").innerHTML = hour + ":" + minute + ":" + second;
    }

    setInterval(updateTime, 1000);
</script>

上述代码中,我们定义了一个updateTime()函数,该函数会在页面加载后立即执行一次,在函数内部获取当前时间并更新HTML元素的内容。同时,我们使用setInterval()函数来每隔一秒钟(1000毫秒)调用一次updateTime()函数,以保证时间的实时更新。

二、JS显示最后修改时间

1. 显示文件最后修改时间

我们可以使用以下JavaScript代码来显示文件的最后修改时间:

<p id="last-modified"></p>
<script>
    var lastModified = new Date(document.lastModified);
    document.getElementById("last-modified").innerHTML = lastModified.toLocaleString();
</script>

上述代码的意思是,首先获取文件的最后修改时间(使用document.lastModified属性),然后将其转换为Date对象。最后,我们使用toLocaleString()方法来将Date对象格式化成本地日期时间字符串,并将其显示在HTML页面的<p>标签中。

我们可以将上述代码添加到HTML文件中,并在浏览器中打开,就可以看到文件的最后修改时间的显示效果。

2. 显示网页最后修改时间

同样地,我们可以使用以下JavaScript代码来显示网页的最后修改时间:

<p id="last-modified"></p>
<script>
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.open("HEAD", window.location.href, true);
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var lastModified = new Date(xmlhttp.getResponseHeader("Last-Modified"));
            document.getElementById("last-modified").innerHTML = lastModified.toLocaleString();
        }
    };
    xmlhttp.send(null);
</script>

上述代码中,我们使用了XMLHttpRequest(XHR)对象来获取当前网页的HTTP头信息,其中包括Last-Modified字段,即网页的最后修改时间。我们通过open()方法来打开HEAD请求,并使用getResponseHeader()方法来获取Last-Modified字段的值。最后,我们将获取到的时间转换为Date对象,并将其格式化成本地日期时间字符串,显示在HTML页面的<p>标签中。

需要注意的是,由于使用了XHR对象发送了一个HTTP HEAD请求,因此如果网页的最后修改时间没有被服务器记录,那么该方法将无法获取到正确的时间。

本文链接:http://task.lmcjl.com/news/11580.html

展开阅读全文