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

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

document.lastModified

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

07/29/2019 15:19:41

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

语法

var lastModificationDate = document.lastModified;

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

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

示例 1

在下面的程序中，我们使用document.lastModified提取文档的最后修改日期和时间，并在 HTML body 中记录它。

<!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 body 中记录它。

<!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 函数，该函数删除第一个段落，从而将文档的修改时间设置为按下按钮时的时刻。

结论

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

更新于: 2022-09-21

5K+ 浏览量

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告

© . All rights reserved.