history对象保存着用户上网的历史记录，从窗口被打开的那一刻算起。由于安全方面的考虑，开发人员无法得到用户浏览器的URL，但借由用户访问过的页面列表，可以在不知道实际URL的情况下实现后退和前进。本文将详细介绍BOM中的history对象
length
history.length属性保存着历史记录的URL数量。初始时，该值为1。如果当前窗口先后访问了三个网址，history.length属性等于3
由于IE10+浏览器在初始时返回2，存在兼容性问题，所以该值并不常用
history.length // 初始时，该值为1 history.length // 访问三个网址后，该值为3
跳转方法
history对象提供了一系列方法，允许在浏览历史之间移动，包括go()、back()和forward()
【go()】
使用go()方法可以在用户的历史记录中任意跳转。这个方法接收一个参数，表示向后或向前跳转的页面数的一个整数值。负数表示向后跳转(类似于后退按钮)，正数表示向前跳转(类似于前进按钮)
//后退一页 history.go(-1) //前进一页 history.go(1); //前进两页 history.go(2);
go()方法无参数时，相当于history.go(0)，可以刷新当前页面
//刷新当前页面 history.go(); //刷新当前页面 history.go(0);
【back()】
back()方法用于模仿浏览器的后退按钮，相当于history.go(-1)
【forward()】
forward()方法用于模仿浏览器的前进按钮，相当于history.go(1)
//后退一页 history.back() //前进一页 history.forward()
如果移动的位置超出了访问历史的边界，以上三个方法并不报错，而是静默失败
[注意]使用历史记录时，页面通常从浏览器缓存之中加载，而不是重新要求服务器发送新的网页
增改记录
HTML5为history对象添加了两个新方法，history.pushState()和history.replaceState()，用来在浏览历史中添加和修改记录。state属性用来保存记录对象，而popstate事件用来监听history对象的变化
[注意]IE9-浏览器不支持
【pushState()】
history.pushState()方法向浏览器历史添加了一个状态。pushState()方法带有三个参数：一个状态对象、一个标题(现在被忽略了)以及一个可选的URL地址
history.pushState(state, title, url);
state object —— 状态对象是一个由pushState()方法创建的、与历史纪录相关的javascript对象。当用户定向到一个新的状态时，会触发popstate事件。事件的state属性包含了历史纪录的state对象。如果不需要这个对象，此处可以填null
title —— 新页面的标题，但是所有浏览器目前都忽略这个值，因此这里可以填null
URL —— 这个参数提供了新历史纪录的地址。新URL必须和当前URL在同一个域，否则，pushState()将丢出异常。这个参数可选，如果它没有被特别标注，会被设置为文档的当前URL
假定当前网址是example.com/1.html，使用pushState方法在浏览记录(history对象)中添加一个新记录
var stateObj = { foo: 'bar' }; history.pushState(stateObj, 'page 2', '2.html');
添加上面这个新记录后，浏览器地址栏立刻显示example.com/2.html，但并不会跳转到2.html，甚至也不会检查2.html是否存在，它只是成为浏览历史中的最新记录。假如这时访问了google.com，然后点击了倒退按钮，页面的url将显示2.html，但是内容还是原来的1.html。再点击一次倒退按钮，url将显示1.html，内容不变
总之，pushState方法不会触发页面刷新，只是导致history对象发生变化，地址栏的显示地址发生变化
如果pushState的url参数，设置了一个新的锚点值(即hash)，并不会触发hashchange事件，，即使新的URL和旧的只在hash上有区别
如果设置了一个跨域网址，则会报错。这样设计的目的是，防止恶意代码让用户以为他们是在另一个网站上
// 报错 history.pushState(null, null, 'https://twitter.com/hello');
【replaceState()】
history.replaceState方法的参数与pushState方法一模一样，不同之处在于replaceState()方法会修改当前历史记录条目而并非创建新的条目
假定当前网页是example.com/example.html
history.pushState({page: 1}, 'title 1', '?page=1'); history.pushState({page: 2}, 'title 2', '?page=2'); history.replaceState({page: 3}, 'title 3', '?page=3'); history.back() // url显示为?page=1 history.back() // url显示为 history.go(2) // url显示为?page=3
【state】
history.state属性返回当前页面的state对象
history.pushState({page: 1}, 'title 1', '?page=1'); history.state// { page: 1 }
【popstate事件】
每当同一个文档的浏览历史(即history对象)出现变化时，就会触发popstate事件