如何使用JavaScript显示文档上次修改的日期和时间？

我们使用document对象的lastModified属性来显示使用JavaScript文档上次修改的日期和时间。此命令将提供精确的修改日期和时间。文档对象是DOM的一部分，它将整个HTML呈现为对象的层次结构及其属性，并存储网页的不同属性。

document.lastModified

它是文档对象的只读属性，返回一个包含文档上次修改日期和时间的字符串。格式如下所示：

07/29/2019 15:19:41

注意 - lastModified 属性仅适用于网页内容没有动态生成的网页。

语法

var lastModificationDate = document.lastModified;

我们将document.lastModified返回的字符串存储在变量lastModificationDate中。

让我们来看一个例子以便更好地理解。

示例1

在下面的程序中，我们使用document.lastModified提取文档的上次修改日期和时间，并将其记录在HTML正文中。

<!DOCTYPE html>
<html>
<body>
   <div id = "result"></div>
   <script>
      var date = document.lastModified;
      document.getElementById("result").innerHTML = "The document was last modified on : " + date;
   </script>
</body>
</html>

什么算作修改？

Web服务器将任何文件更改视为修改的来源，此信息源自请求的HTTP标头。如果Web服务器无法从HTTP标头检索修改信息，则会为文档提供01/01/1971 12:00:00的默认日期和时间。

JavaScript提供与Web浏览器时钟同步的Date对象。它以更详细的方式打印日期、时间和时区，例如：

Tue Sep 06 2022 21:33:42 GMT+0530 (India Standard Time)

创建Date()对象的方法有很多。我们将使用Date()构造函数，其中我们将日期和时间的字符串作为参数提供，以检索相应的Date对象。

语法

var lastModificationDate = new Date(document.lastModified);

我们将文档的lastModified属性（一个字符串）作为参数提供给Date对象。然后将相应的Date对象存储在lastModificationDate中。

示例2

在下面的程序中，我们使用document.lastModified提取文档的上次修改日期和时间，并从中创建一个Date对象，然后将其记录在HTML正文中。

<!DOCTYPE html>
<html>
<body>
   <div id = "result"></div>
   <script>
      var date = document.lastModified;
      var lastModifiedDate = new Date(date);
      document.getElementById("result").innerHTML = "The document was last modified on : " + lastModifiedDate;
   </script>
</body>
</html>

我们可以通过删除元素来修改HTML文档。这会更改文档的修改日期，该日期会记录在屏幕上。

语法

parent.removeChild(child);

这里，parent 是指我们要删除其子元素的元素的对象，child 是需要删除的对象。

但是，在某些情况下，我们可能不知道父元素。在这种情况下，我们可以使用类似这样的方法：

child.parentNode.removeChild(child);

其中，child 是我们要删除的子元素的对象。请注意，parentNode 是一个用于了解元素父级的js属性。

让我们通过一个例子更好地理解这一点：

示例3

在下面的代码片段中，文档中有两个段落，其中一个在按下更改按钮时被删除。然后将修改日期记录在屏幕上。

<!DOCTYPE html>
<html>
<body>
   <div id = "result">The modification date of this document can be changed with the below button !
      <p id = "para1"> This is the first paragraph. </p>
      <p id = "para2"> This is the second paragraph. </p>
   </div>
   <button onclick = "change()"> change !</button><br><br>
   <p id = "modificationDate">The document was last modified on :</p>
   <script>
      function change(){
         var dateDiv = document.getElementById("modificationDate");
         var resultDiv = document.getElementById("result");
         var para1 = document.getElementById("para1");
         resultDiv.removeChild(para1);
         var date = document.lastModified;
         dateDiv.innerHTML = date;
      }
   </script>
</body>
</html>

更改按钮触发更改JavaScript函数，该函数删除第一个段落，从而将文档的修改时间设置为按下按钮的时间。

结论

文档对象的lastModified属性对于了解文档上次更改的时间非常有帮助。但是，它的效用仅限于静态页面，而如今这样的页面很少。

更新于：2022年9月21日

5K+ 次浏览

启动你的职业生涯

完成课程获得认证

开始学习
广告
© . All rights reserved.