aty

在上一篇文章中介绍history.pushState()的时候，我们提到location.hash存在的3个问题。第一个问题：url会发生改变，这个很容易理解。现在我们看下第二个问题和第三个问题，即如何修改浏览器的历史记录，如何让历史记录存储更多状态相关的信息。状态相关的信息上一篇博客其实已经很容易看出来了，history.pushState()的第一个参数是javascript对象，我们当然可以在这个对象中存放任何我们想要的数据。本文我们主要看一下，如何利用histroy.replaceState修改浏览

上一篇文章中，我们使用location.hash来模拟ajax的前进后退功能。使用location.hash存在下面几个问题：1.使用location.hash会导致地址栏的url发生变化，用户体验不够友好。2.location.hash产生的历史记录无法修改，每次hash改变都会导致产生一个新的历史记录。3.location.hash只是1个字符串，不能存储很多状态相关的信息。为了解决这些问题，HTML5中引入了history.pushState()、history.replaceState()、

比如你的项目中有保存草稿的功能，只是先将数据临时存储在本地，以后再提及到服务器。这就需要我们将数据持久地存储在本地，这就需要用到HTML5中的本地化存储解决方案。本文主要介绍下sessionStorage、localStorage和websql database这3种存储方案。localStorage只能存储简单格式数据就是key-value这种数据格式，而websql存储方案则提供了类似于关系数据库的表，能够以sql语句的形式操作数据库。

页面历史记录管理，其实和浏览器自带的前进和后退按钮很类似，就是为了保证在某个页面点击返回键的时候，能够正确地返回用户想要回到的上一个页面。对于浏览器来说，如果我们依次打开页面A-->B-->C-->D，我们在D页面点浏览器的回退是回到C页面，C回到B，B回到A。但是对于一个业务系统来说，这种返回逻辑太简单了，不能满足一些特点场景的使用。比如我们的混合app主页是A(任务列表页面，一条一条的任务)，我们点击列表的某一条数据后，会跳转到B(router页面，用户不可见)，B页面会根据一些条件跳转到C或者D等页面