1、历史记录的前进和后退
在历史记录中后退,可以这么做:
window.history.back();
这就像用户点击浏览器的后退按钮一样。
类似的,你可以前进,就像在浏览器中点击前进按钮,像这样:
window.history.forward();
2、移动到指定历史记录点
通过指定一个相对于当前页面位置的数值,你可以使用go()方法从当前会话的历史记录中加载页面(当前页面位置索引值为0,上一页就是-1,下一页为1)。
要后退一页(相当于调用back()):
window.history.go(-1);
向前移动一页(相当于调用forward()):
window.history.go(1);
类似的,传递参数“2”,你就可以向前移动2个记录点。你可以查看length属性值,了解历史记录栈中一共有多少个记录点:
window.history.length;
二、修改历史记录点
HTML5的新API扩展了window.history,使历史记录点更加开放了。可以存储当前历史记录点、替换当前历史记录点、监听历史记录点,下面逐一简要说明一下。
1、存储当前历史记录点
存储的方式类似于数组的入栈(Array.push()
),在window.history里新增一个历史记录点,例如:
if (window.history && window.history.pushState) {
$(window).on('popstate', function () {
window.history.pushState('forward', null, location.href);
window.history.forward(1);
});
}
window.history.pushState('forward', null, location.href); //在IE中必须得有这两行
window.history.forward(1);