URL的hash和HTML5的histpry

如何改变url，但是不刷新页面？

一. url的hash

• URL的hash也就是锚点(#), 本质上是改变window.location.href属性.
• 直接赋值location.hash来改变href, 但是页面不发生刷新

前端路由会监控hash的改变，当hash改变的时候，匹配对应的页面

二.HTML5的history

history接口是HTML5新增的, 它有五种模式改变URL而不刷新页面

1.history.pushState()

pushState()可以改变url页面不刷新，同时将当前url入栈

 history.pushState({},'','a')
 history.pushState({},'','b')
 history.pushState({},'','c')

 url依次改变为a,b,c,对a,b,c分别进行入栈操作（先进后出）

当执行history.back()或者点击浏览器上的后退按钮,栈顶元素c被移除，url变为b

2.history.replaceState()

替换原来的url，不做记录，不能后退

 3.history.go()

• history.back() 等价于 history.go(-1)
• history.forward() 则等价于 history.go(1)
• 这三个接口等同于浏览器界面的前进后退。