在本教程中,您将学习如何使用 JavaScript history 对象访问浏览器的历史记录。

JavaScript history 对象简介

当您启动 Web 浏览器并打开新网页时,Web 浏览器会在其历史记录堆栈中创建一个新的记录。如果您导航到另一个网页,Web 浏览器还会在历史记录堆栈中创建一个新的记录。

历史堆栈存储您访问过的当前页面和之前的页面。要操作历史堆栈,您可以使用 history 对象,它是 window 对象的属性:

window.history

出于安全原因,你可能无法查询用户访问过的页面。但是,您可以使用 history 对象来回导航,而无需知道确切的 URL。

JavaScript history 对象导航

history 对象提供三种在历史堆栈中的页面之间导航的方法:

  • back()
  • forward()
  • go()

向后移动

要向后追溯历史,可以使用 history 对象的 back() 方法:

window.history.back();

或者

history.back();

这就像您单击在 Web 浏览器工具栏中的后退按钮一样

前进

同样,您可以使用 history 对象的 forward() 方法继续前进,它的工作原理就像单击前进按钮一样。

history.forward();

移动指定的历史记录

要移动到历史堆栈中的特定 URL,可以使用 go() 方法。go() 方法接受一个整数,该整数表示与当前页面的相对位置。当前页面的位置是 0。

例如,要向后移动,您可以使用以下代码:

history.go(-1);

就像back()方法一样。

要前进一页,您只需调用:

history.go(1)

要刷新当前页面,您可以向 go() 方法传递 0 参数或不传递任何参数:

history.go(0); 
history.go()

要确定历史堆栈中的 URL 数量,请使用 history 对象的 length 属性:

history.length

结论

window.history 对象允许您访问浏览器的历史堆栈。要导航到历史记录中的 URL,您可以使用 back()forward()go() 方法。history.length 返回历史堆栈 URL 的数量。