history对象保存了用户从打开窗口那一刻的上网历史记录。出于安全限制,开发人员无法读取用户的历史记录,但是可以通过history提供的方法,在不知道实际URL的情况下实现后退和前进。
一、属性
history.length表示历史记录的URL数量,初始值是1,如果已经访问了3个网址,history.length值就是3
console.log(history.length); // 1
二、方法
history对象提供了go()、back()、forward()方法,用于操作浏览历史之间的移动。
go()
go()方法可以在历史记录中任意跳转,它接收一个整数值作为参数,表示向前或向后的页面数。负数表示向后跳转(类似于后退按钮),正数表示向前跳转(类似于前进按钮),0相当于刷新当前页面
history.go(-1); // 后退一步
history.go(2); // 前进两步
history.go(0); // 刷新当前页
back()
back()方法用于模仿浏览器的后退按钮,相当于history.go(-1)
history.back();
forward()
forward()方法用于模仿浏览器的前进按钮,相当于history.go(1)
history.forward();
注意: 如果移动的位置超出了访问历史的边界,以上三个方法并不报错,而是静默失败。使用历史记录时,页面通常从浏览器缓存之中加载,而不是重新要求服务器发送新的网页
三、H5新增方法:增改记录
HTML5为history对象提供了history.pushState()
和history.replaceState()
方法,用于添加和修改浏览器历史记录。
pushState()
pushState()方法接收三个参数:状态对象stateObject、标题title、URL地址(可选)。该方法向历史记录中添加一个状态。
history.pushState(object state, string title, string url)
方法能实现在不刷新页面的情况下修改浏览器 url 链接,并且该方法创建了新的浏览记录,并将新的链接插入到浏览记录队列中。判断是否支持
pushSta