NavigationHistoryEntry

可用性有限

此功能不是基线功能，因为它在一些最广泛使用的浏览器中无法正常工作。

实验性： 这是一个实验性技术
在生产环境中使用此功能之前，请仔细查看浏览器兼容性表。

NavigationHistoryEntry 是 导航 API 的一个接口，它表示单个导航历史条目。

通常可以通过 Navigation.currentEntry 属性和 Navigation.entries() 方法访问这些对象。

导航 API 仅公开在当前浏览上下文中创建且与当前页面具有相同来源的历史条目（例如，嵌入式 <iframe> 中的导航或跨源导航除外），从而为您的应用提供所有先前历史条目的准确列表。这使得遍历历史记录比使用旧的 历史记录 API 更加稳定。

EventTarget NavigationHistoryEntry

实例属性

继承自其父级 EventTarget 的属性。

id 只读

返回历史条目的 id。这是一个唯一的、UA 生成的值，始终表示特定的历史条目，可用于将其与外部资源（例如存储缓存）相关联。

index 只读

返回历史条目在历史条目列表中的索引（即 Navigation.entries() 返回的列表），如果条目未出现在列表中，则返回 -1。

key 只读

返回历史条目的 key。这是一个唯一的、UA 生成的值，表示历史条目在条目列表中的槽位，而不是条目本身。它用于通过 Navigation.traverseTo() 导航到该特定槽位。key 将被替换列表中条目的其他条目重用（即，如果 NavigateEvent.navigationType 为 replace）。

sameDocument 只读

如果此历史条目与当前 Document 值相同，则返回 true，否则返回 false。

url 只读

返回此历史条目的绝对 URL。如果条目对应于与当前条目不同的文档（例如 sameDocument 属性为 false），并且该文档使用设置为 no-referrer 或 origin 的 Referrer-Policy 标头获取，则该属性返回 null。

实例方法

继承自其父级 EventTarget 的方法。

getState()

返回与此历史条目关联的可用状态的克隆。

事件

dispose

当条目不再是历史条目列表的一部分时触发。

示例

js
function initHomeBtn() {
  // Get the key of the first loaded entry
  // so the user can always go back to this view.
  const { key } = navigation.currentEntry;
  backToHomeButton.onclick = () => {
    navigation.traverseTo(key);
  };
}
// Intercept navigate events, such as link clicks, and
// replace them with single-page navigations
navigation.addEventListener("navigate", (event) => {
  event.intercept({
    async handler() {
      // Navigate to a different view,
      // but the "home" button will always work.
    },
  });
});

规范

规范
HTML 标准
# the-navigationhistoryentry-interface

浏览器兼容性

BCD 表仅在启用了 JavaScript 的浏览器中加载。

另请参阅