js实现页面返回
使用 history.back() 方法
调用 history.back() 会导航到浏览器历史记录中的上一页,效果与用户点击浏览器的“后退”按钮相同。
function goBack() {
history.back();
}
使用 history.go() 方法
通过指定负数参数(如 -1)返回上一页,正数参数(如 1)前进到下一页。

function goBack() {
history.go(-1);
}
监听浏览器返回按钮事件
通过 popstate 事件监听用户手动触发返回操作,适合需要在返回时执行额外逻辑的场景。

window.addEventListener('popstate', function(event) {
console.log('用户触发了返回操作');
// 自定义逻辑
});
使用 window.location 跳转
直接修改 window.location.href 或调用 replace() 方法强制跳转(无历史记录)。
// 返回上一页(需记录上一页URL)
function goBack() {
window.location.href = document.referrer; // 获取来源页URL
}
// 替换当前页(不保留历史记录)
function replacePage() {
window.location.replace('https://example.com');
}
单页应用(SPA)的路由返回
在 Vue、React 等框架中,使用路由库提供的导航方法(如 router.go(-1))。
// Vue Router 示例
this.$router.go(-1);
// React Router 示例
import { useNavigate } from 'react-router-dom';
const navigate = useNavigate();
navigate(-1);
注意事项
history.back()和history.go(-1)在无历史记录时无效。- 单页应用需确保路由库与浏览器历史记录同步。
- 某些浏览器可能限制脚本触发的返回操作(如跨域限制)。






