JS | JS之BOM篇 - history对象常用方法详解

 

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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

儒雅的烤地瓜

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值