✨前言✨
本篇文章主要在于了解及使用JavaScript中history对象常用方法
🍒欢迎点赞 👍 收藏 ⭐留言评论 📝私信必回哟😁
🍒博主将持续更新学习记录收获,友友们有任何问题可以在评论区留言
📍文章目录📍
- 一,什么是History对象
- 二,history 对象的属性和方法
- 三,代码示例
- 四,总结
一,什么是History对象
在JavaScript中,history是一个内置对象
,它提供了与浏览器历史记录相关的方法和属性。它允许您在浏览器的历史记录中导航,以及在用户访问不同页面时进行页面的动态修改和管理。
history 对象来保存浏览器历史记录信息,也就是用户访问的页面。浏览器的前进与后退功能本质上就是 history 的操作。history 对象记录了用户浏览过的页面,通过该对象提供的 API 可以实现与浏览器前进/后退类似的导航功能。
二,history 对象的属性和方法
属性和方法 | 描述 |
---|---|
length: | 返回浏览历史记录的当前长度。 |
state: | 返回当前页面的状态信息。 |
title: | 返回当前页面的标题。 |
url: | 返回当前页面的 URL。 |
back(): | 返回到浏览历史记录中的上一个页面。 |
forward(): | 跳转到浏览历史记录中的下一个页面。 |
replaceState(): | 替换浏览历史记录中的当前页面。它需要三个参数:state,用于存储页面的状态信息;title,用于显示在浏览器的标签页上;url,表示页面的实际 URL。 |
三,代码示例
下面是一个简单的示例,演示如何使用 history 对象:
// 添加一个新的页面到浏览历史记录
history.pushState({}, "页面标题", "页面URL");
// 删除当前页面
history.back();
// 跳转到下一个页面
history.forward();
// 获取当前页面的状态信息
console.log(history.state);
// 获取当前页面的标题
console.log(history.title);
// 获取当前页面的 URL
console.log(history.url);
需要注意的是,history 对象只能在用户手动操作浏览器地址栏时生效。例如,通过 JavaScript 代码更改地址栏并不会触发 history 对象的改变。
四,总结
window.history 属性指向 History 对象,它表示当前窗口的浏览历史。当发生-改变时,只会改变页面的路径,不会刷新页面。
History 对象保存了当前窗口访问过的所有页面网址。通过 history.length 可以得出当前窗口一共访问过几个网址。
由于安全原因,浏览器不允许脚本读取这些地址,但是允许在地址之间导航。
浏览器工具栏的“前进”和“后退”按钮,其实就是对 History 对象进行操作。
✨最后✨
总结不易,希望uu们不要吝啬你们的👍哟(^U^)ノ~YO!!
如有问题,欢迎评论区批评指正😁