通过haschange事件，可以知道URL的参数什么时候发生了变化，也就是什么时候该有所反应。通过状态管理的API，能够在不加载新页面的情况下改变浏览器的URL。所以需要使用history.pushState()方法。history.pushState()方法接收三个参数：1.要存的内容 2.标题(一般写个空的字符串) 3.地址(可选)。小例子如下
执行了history.pushState()方法后，新的状态信息就会被加入到历史状态栈，而浏览器地址栏也会变成新的相对URL。但是，浏览器并不会想服务器发送请求，即使历史状态改变之后查新location.href也会返回与地址栏中相同的地址。另外，第二个参数目前还没有浏览器实现，所以完全可以只传入一个空字符串即可，或者一个短标题也可以。第一个参数则应该尽可能提供初始化页面状态所需的各种信息。
因为history.pushState()方法会创建新的历史状态，所以会发现”后退”按钮也可以使用了。按下”后退”按钮，会触发window对象的popstate事件。Popstate事件的事件对象有一个state属性，这个属性就包含着当初以第一个参数传递给pushState()的状态对象。小例子如下
更新状态直接更新当前地址栏的内容，他不会产生后退操作，只是单纯修改当前地址。
要更新当前历史状态，可以调用replaceState()，传入的参数与pushState()方法的前两个参数相同。调用replaceState()不会在历史状态栈中创建新状态，只会重写当前状态。小例子如下
网上例子：
他这个还是创建了一个数组，然后把生成的内容存到数组中，在根据传的值
把数组对应的内容给读出来。
history有个问题是第一次点击是无效的，只有第二次才能起作用。这就非常的不爽了。
通常我们也不会需要他执行特别复杂的操作，反而是hash非常的好用。
hash是直接在url后面加一个#，然后立即可以被onpopstate事件检测到。
于是我们可以这样去做：
History 对象从 HTML4 开始引入，HTML5 中增加了 pushState, replaceState 两个方法，和 popstate 事件。下面作一些简单的介绍。1. pushState()方法
pushState() 的作用是往历史记录的堆栈中压入一条记录，该方法有三个参数：
state object —— 一个对象，用于保存状态信息，当 popstate 事件被触发时，popstate 事件对象的 state 属性会包含相应的 state object 的拷贝。state object 的容量很小（Firefox 中强制为 640k），如果需要储存较大的数据，建议使用 localStorage 或 sessionStorage。
title —— 即被压入的历史记录的页面的标题，该属性暂时被所有浏览器忽略，实际开发时可以填空字符或一个简短的标题。
url —— 新的历史记录的地址，可以是相对路径或绝对路径，若为相对路径则以当前 url 为基址。
2. replaceState()方法
replaceState() 方法与 pushState() 方法类似，参数与 pushState() 也相同，但 replaceState() 方法会修改当前的历史记录而并非创建新的记录，因此在需要更新当前历史记录的 state object 或 URL 时，使用该方法会更加合适。
3. popstate 事件
popstate 事件会在激活的历史记录发生变化（如前进、后退、调用 pushState 或 replaceState 方法）时触发在 window 对象上。如上面所描述，如果被激活的历史记录由 pushState 创建或是被 replaceState 修改，则 popstate 事件的状态属性将包含相应的 state object 的拷贝，开发者可以在 popstate 的回调中调用这些之前保存在 state object 中的信息。
值得注意的是，Chrome 会在打开页面（包括第一次打开页面）以及页面刷新时产生 popstate 事件而 Firefox 则不会，这会为开发带来一些麻烦，但下面会给出解决方案。
