导航 API 只公开当前浏览上下文中创建的与当前页面具有相同来源的历史记录条目（例如，不是嵌入式 <iframe> 中的导航，或跨来源导航），为您的应用程序提供所有先前历史记录条目的准确列表。这使得遍历历史记录比使用旧的历史记录 API 更不容易出错。

实例属性

它继承了其父级 EventTarget 的属性。

canGoBack 只读实验性: 如果可以在导航历史记录中向后导航（即 currentEntry 不是历史记录条目列表中的第一个条目），则返回 true，否则返回 false。
canGoForward 只读实验性: 如果可以在导航历史记录中向前导航（即 currentEntry 不是历史记录条目列表中的最后一个条目），则返回 true，否则返回 false。
currentEntry 只读实验性: 返回一个 NavigationHistoryEntry 对象，表示用户当前导航到的位置。
transition 只读实验性: 返回一个 NavigationTransition 对象，表示正在进行的导航的状态，可用于跟踪导航。如果当前没有导航正在进行，则返回 null。

实例方法

它继承了其父级 EventTarget 的方法。

back() 实验性: 在导航历史记录中向后导航一个条目。
entries() 实验性: 返回一个 NavigationHistoryEntry 对象数组，表示所有现有的历史记录条目。
forward() 实验性: 在导航历史记录中向前导航一个条目。
navigate() 实验性: 导航到特定 URL，更新历史记录条目列表中提供的任何状态。
reload() 实验性: 重新加载当前 URL，更新历史记录条目列表中提供的任何状态。
traverseTo() 实验性: 导航到通过 key 标识的特定 NavigationHistoryEntry。
updateCurrentEntry() 实验性: 更新 currentEntry 的状态；用于状态更改将独立于导航或重新加载的情况。

事件

currententrychange 实验性: 当 Navigation.currentEntry 发生变化时触发。
navigate 实验性: 当任何类型的导航被启动时触发，允许您根据需要进行拦截。
navigateerror 实验性: 当导航失败时触发。
navigatesuccess 实验性: 当成功的导航完成时触发。

示例

在历史记录中前后移动

async function backHandler() {
  if (navigation.canGoBack) {
    await navigation.back().finished;
    // Handle any required clean-up after
    // navigation has finished
  } else {
    displayBanner("You are on the first page");
  }
}

async function forwardHandler() {
  if (navigation.canGoForward) {
    await navigation.forward().finished;
    // Handle any required clean-up after
    // navigation has finished
  } else {
    displayBanner("You are on the last page");
  }
}

遍历到特定的历史记录条目

// On JS startup, get the key of the first loaded page
// so the user can always go back there.
const { key } = navigation.currentEntry;
backToHomeButton.onclick = () => navigation.traverseTo(key);

// Navigate away, but the button will always work.
await navigation.navigate("/another_url").finished;

导航和更新状态

navigation.navigate(url, { state: newState });

或者

navigation.reload({ state: newState });

或者如果状态独立于导航或重新加载

navigation.updateCurrentEntry({ state: newState });

规范

规范
HTML 标准 # navigation-interface

浏览器兼容性

BCD 表格仅在浏览器中加载

导航

有限可用性