NavigationHistoryEntry：key 属性

可用性有限

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

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

key 是 NavigationHistoryEntry 接口的只读属性，它返回历史记录条目的 key，如果当前文档未完全激活，则返回空字符串。这是一个唯一的、由 UA 生成的值，表示历史记录条目在条目列表中的槽位。它用于通过 Navigation.traverseTo() 导航到该特定槽位。key 将被替换列表中条目的其他条目重用（即，如果 NavigateEvent.navigationType 为 replace）。

这与历史记录条目的 id 不同。id 是一个唯一的、由 UA 生成的值，它始终表示特定的历史记录条目，而不是它在条目列表中的槽位。这对于将其与外部资源（如存储缓存）相关联很有用。

值

表示 NavigationHistoryEntry 的 key 的字符串。

示例

基本用法

js
const current = navigation.currentEntry;
console.log(current.key);

设置主页按钮

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 标准
# dom-navigationhistoryentry-key-dev

浏览器兼容性

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

另请参阅