Linux 拨号vps windows公众号手机端

H5的pushState与replaceState的用法

lewis 8年前 (2017-06-04) 阅读数 10 #程序编程
文章标签 h5

H5的pushState和replaceState是History对象的两个方法,它们都用于修改浏览器的历史记录。

pushState方法用于添加一个新的历史记录,并且不会刷新页面。它接受三个参数:state、title和url。

  • state:一个JavaScript对象,表示新的历史状态。这个对象可以包含任意的数据,用于保存页面的状态信息。
  • title:新的历史记录的标题,目前大部分浏览器忽略这个参数。
  • url:新的历史记录的URL,可以是相对URL或绝对URL。

例子:

history.pushState({page: 1}, "Page 1", "/page1");

以上代码将添加一个新的历史记录,URL为/page1,状态对象为{page: 1}。

replaceState方法用于替换当前的历史记录,并且也不会刷新页面。它接受三个参数:state、title和url,和pushState方法的参数相同,只是replaceState会替换当前的历史记录,而不是添加一个新的。

history.replaceState({page: 2}, "Page 2", "/page2");

以上代码将替换当前的历史记录,URL为/page2,状态对象为{page: 2}。

使用pushState和replaceState方法可以实现无刷新的页面跳转和页面状态管理,可以配合popstate事件来监听历史记录的变化,并根据状态对象进行相应的操作。

版权声明

本文仅代表作者观点,不代表米安网络立场。

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

热门