前置条件
传统的网页开发，页面的跳转都是通过a链接实现，如果这种传统的项目在普通的 pc 显示是没有任何问题的。如果是这样的网页在手机端打开，由于手机屏幕相对很小，传统的网页的a链接跳转用户体验很差。手机端app跳转的体验还是很好的，app里面的很多的部分不会变化的，只会局部的变化（手机 app 经典布局：上有天、下有地、中间有内容，只是中间的内容局部的刷新变化）。能不能使用一些技术可以把传统的网页的用户体验开发成类似app的体验。（说白了就是把a链接的跳转模式改成手机端app的局部的跳转刷新）
一般我们可以使用 hash 监听进行实现。
ajax 也可以实现局部的刷新，也可以达到类似 app 体验（问题： 1. ajax是没有历史记录）
hash（页面的锚点：实现本页面的跳转）1. hash 不会导致页面的刷新 2. hash 存在历史记录（histroy 前进后退）
使用 hash 这种技术实现的页面的局部刷新形成的网页应用，我们一般叫做 SPA 应用（signal page application 单页应用）我们网页里面的所有的功能都是在一个页面进行完成的。
为什么目前会比较流行 spa 应用？
答：主要是原因是现在是移动互联网时代，用户的显示的网页的设备都是小屏幕进行页面的呈现，为了更好的用户体验，需要把网页开发成类似 app 的用户体验，则我们就需要使用 hash 技术，实现局部的刷新，形成一个单页应用。
常见的单页应用有哪些，或者说 哪些场景使用做SPA应用？
答：网易云音乐、teambition、worktile；一般来说这些管理系统使用做成SPA应用，一些比较注重用户体验的应用。
这里有个小案例可以使你理解hash的页面锚点跳转问题，是通过window.onhashchange里面的location.hash监听到a标签的href="#/a1"是什么，从而对页面渲染。
<body>
<ul>
<li>
<a href="#/a1">1</a><a href="#/a2">2</a><a href="#/a3">3</a>
</li>
</ul>
<div id="box"></div>
<script src="https://cdn.bootcss.com/jquery/2.0.1/jquery.js"></script>
<script type="text/javascript">
//传统网页开发都是通过a链接跳转，由于手机屏幕很小，传统网页a链接跳转，用户体验不友好
//app里面很多部分不会变化，只是局部中间内容变化，头和尾不会变化
//把pc的a链接跳转模式改成手机app的局部刷新，可以利用hash监听（本页面的跳转）
//hash不会导致页面刷新，hash存在历史记录，可前进后退
//ajax可以局部刷新，但是不可以有历史记录
//hash技术SPA单页面应用，所有功能都是在一个网页进行的。
// 一般管理系统适合做SPA，用户体验
var html=``
window.onhashchange=function () {
var hash=location.hash;
if(hash==='#/a1'){
html=`<div>A1</div>`
}else if(hash==='#/a2'){
html=`<div>A2</div>`
}else if(hash==='#/a3'){
html=`<div>A3</div>`
}
$('#box').html(html)
}
</script>
</body>
