首页 > 编程语言> 文章详细

JavaScript中的history对象

2022-08-04 20:34:42 阅读：452 来源： 互联网

标签：历史记录浏览器对象 JavaScript state 参数 history 页面

简介：

history对象记录了用户曾经浏览过的页面(URL)，并可以实现浏览器前进与后退相似导航的功能。允许操作浏览器的曾经在标签页或者框架里访问的会话历史记录。

注意:从窗口被打开的那一刻开始记录，每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。

属性

1.history.length（只读）

返回一个整数，该整数表示会话历史中元素的数目，包括当前加载的页。例如，在一个新的选项卡加载的一个页面中，这个属性返回 1。

2.history.scrollRestoration

允许 Web 应用程序在历史导航上显式地设置默认滚动恢复行为。此属性可以是自动的（auto）或者手动的（manual）。

history.scrollRestoration = 'manual'; //关闭浏览器自动滚动行为
history.scrollRestoration = 'auto'; //打开浏览器自动滚动行为(默认)

3.history.state（只读）

返回一个表示历史堆栈顶部的状态的值。这是一种可以不必等待popstate (en-US) 事件而查看状态的方式。

方法

1.history.back()

在浏览器历史记录里前往上一页，用户可点击浏览器左上角的返回 (译者注：←) 按钮模拟此方法。等价于 history.go(-1).
Note: 当浏览器会话历史记录处于第一页时调用此方法没有效果，而且也不会报错。

2.history.forward()

在浏览器历史记录里前往下一页，用户可点击浏览器左上角的前进 (译者注：→) 按钮模拟此方法。等价于 history.go(1).
Note: 当浏览器历史栈处于最顶端时 ( 当前页面处于最后一页时 ) 调用此方法没有效果也不报错。

3.history.go()

通过当前页面的相对位置从浏览器历史记录 ( 会话记录 ) 加载页面。比如：参数为-1 的时候为上一页，参数为 1 的时候为下一页。当整数参数超出界限时 ( 译者注：原文为 When integerDelta is out of bounds )，例如：如果当前页为第一页，前面已经没有页面了，我传参的值为-1，那么这个方法没有任何效果也不会报错。调用没有参数的 go() 方法或者参数值为 0 时，重新载入当前页面。( 这点与支持字符串作为 url 参数的 IE 有点不同)。

4.history.pushState()

按指定的名称和 URL（如果提供该参数）将数据 push 进会话历史栈，数据被 DOM 进行不透明处理；你可以指定任何可以被序列化的 javascript 对象。

//spa 单页应用
function fn3(){
    //添加state的值 数据  ""  地址(会产生跨域问题)
    history.pushState('hello','','./index.html') //会改地址 但是不会刷新 推一个历史页面到历史区 state设置进去
}

5.history.replaceState(）

按指定的数据，名称和 URL(如果提供该参数)，更新历史栈上最新的入口。这个数据被 DOM 进行了不透明处理。你可以指定任何可以被序列化的 javascript 对象。

replace比起push的差异在于，push是进栈把当前页面放在栈中，但是replace是会直接取代当前页面。

function fn4(){
    //替换state
    history.replaceState('world','','/location对象讲解.html') //会改地址 但是不会刷新 在历史区直接修改当前这个历史页面 state设置进去
}

标签：历史记录,浏览器,对象,JavaScript,state,参数,history,页面
来源： https://www.cnblogs.com/qianduanLamp/p/16552201.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9