hash

1.url# 右面的，样式不好看    

2.虽然在url里面，但是不会被http请求，对后端没有什么影响，改变hash不会重新刷新页面（包括F5刷新）

hash主要是一个事件：hashchang     当hash改变时，就会触发这个事件

补充：window.location对象里面有

hash： 设置或返回从 (#) 开始的URL（锚）。

host： 设置或返回主机名和当前URL的端口号。

hostname：设置或返回当前URL的主机名。

href： 设置或返回完整的URL。

pathname： 设置或返回当前URL的路径部分。

port：设置或返回当前URL的端口号。

search： 设置或返回从问号 (?) 开始的URL（查询部分）。

assign() ： 加载新的文档。

reload() ： 重新加载当前文档。

replace() ： 用新的文档替换当前文档。

hashchange事件有两个属性：

history

利用了 HTML5 History Interface 中新增的 pushState() 和 replaceState() 方法。（需要特定浏览器支持）这两个方法应用于浏览器的历史记录

栈，在当前已有的 back、forward、go 的基础之上，它们提供了对历史记录进行修改的功能。只是当它们执行修改时，虽然改变了当前的 URL，

但浏览器不会立即向后端发送请求。

window.history(可写成history)指向History对象，他表示当前history的浏览历史

History对象保存了当前窗口访问过的所有页面网址（history.length属性保存着历史记录的url数量）

自带的跳转方法：

go() 接受一个整数为参数，移动到该整数指定的页面，比如history.go(1)相当于history.forward(),history.go(-1)相当于history.back(),history.go(0)相当于刷新当前页面

back() 移动到上一个访问页面，等同于浏览器的后退键,常见的返回上一页就可以用back()，是从浏览器缓存中加载，而不是重新要求服务器发送新的网页

forward() 移动到下一个访问页面，等同于浏览器的前进键如果移动的位置超出了访问历史的边界

（补充：以上三个方法并不报错，而是默默的失败）

        新添了 pushstate 和  replacestate 的属性    

state: 一个与指定网址相关的状态对象，popState事件触发时，该对象会传入回调函数，如果不需要这个对象，此处可填null

title: 新页面的标题，但是所有浏览器目前都忽略这个值，因此这里可以填null

url: 新的网址，必须与当前页面处在同一个域，浏览器的地址栏将显示这个网址

        popState 事件：

每当同一个文档的浏览历史（即history）出现变化时，就会触发popState事件

需要注意：仅仅调用pushState方法或replaceState方法，并不会触发该事件，只有用户点击浏览器后退和前进按钮时，或者使用js调用back、

forward、go方法时才会触发。另外该事件只针对同一个文档，如果浏览历史的切换，导致加载不同的文档，该事件不会被触发

使用的时候，可以为popState事件指定回调函数回调函数的参数是一个event事件对象，它的state属性指向pushState和replaceState方法为当前url

所提供的状态对象（即这两个方法的第一个参数）。上边代码中的event.state就是通过pushState和replaceState方法为当前url绑定的state对象

这个state也可以直接通过history对象读取history.state

注意：页面第一次加载的时候，浏览器不会触发popState事件

对比

pushState()设置的新的url可以是于当前url同源的任意url，而hash只可修改#后面的部分，因此只能设置与当亲url同文档的url

pushState()设置的新的url可以与当前url一摸一样，这样也会把记录添加到栈中；而hash设置的新值必须与原来的不一样才会触发动作将记录添加到栈中

pushState()通过stateObject参数可以添加任意类型的数据到记录中；而hash只可添加短字符串

pushState()可额外设置title属性提供后续使用