js页面历史返回

历史是一堆灰烬，但灰烬深处有余温。——黑格尔

我们可以使用history.back()来进行页面返回

history的文档：

History API - Web API | MDN

除了返回还可以前进

代码语言：javascript复制

history.forward();

以及

代码语言：javascript复制

// 向后跳转一个页面（等价于调用 back()）
history.go(-1);

然后还有

代码语言：javascript复制

// 向前跳转一个页面，就像调用 forward()
history.go(1);

当然传入0就是刷新

代码语言：javascript复制

// 以下语句都具有刷新页面的效果
history.go(0);
history.go();

还有查看页面栈长度

代码语言：javascript复制

const numberOfEntries = history.length;

补充：

代码语言：javascript复制

window.addEventListener("popstate", (event) => {
  alert(`位置：${document.location}，状态：${JSON.stringify(event.state)}`);
});

history.pushState({ page: 1 }, "标题 1", "?page=1");
history.pushState({ page: 2 }, "标题 2", "?page=2");
history.replaceState({ page: 3 }, "标题 3", "?page=3");
history.back(); // 显示警告“位置：http://example.com/example.html?page=1，状态：{"page":1}”
history.back(); // 显示警告“位置：http://example.com/example.html，状态：null”
history.go(2); // 显示警告“位置：http://example.com/example.html?page=3，状态：{"page":3}”

html http com event history

0 人点赞