多页应用与单页应用（SPA）
多页应用：一个项目中有多个完整的.html页面
单页应用：只有一个.html是完整的（缺少body主体），其它.html都是不完整的（可能只是一个div而已）
多页应用：多个页面间的跳转可以使用超链接、表单提交、JS…
单页应用：多个“伪页面”间的跳转可以使用超链接、JS(...)
多页应用：页面切换是同步请求：客户端先删除第一个页面的DOM结构，发起HTTP请求，等待服务器给第
二个页面的响应数据
单页应用：伪页面切换是异步请求：客户端首先请求一个完整的页面，然后再发起异步AJAX请求，获取不同
的模板页面，插入在当前
的DOM树
多页应用：每个页面都是一个完整的DOM树
单页应用：整个项目只有一个完整的DOM树
多页应用：页面切换时控制权在浏览器手中，不可能添加任何的过场动画效果
单页应用：伪页面切换的本质是一棵DOM树上的两个DIV在切换，可以很容易的添加各种过场动画
项目补充知识点：
一个项目中的多个页面中可能包含完全相同的内容，如京东商城中的很多页面都有完全相同的header和
footer部分，若每个HTML都拷贝一遍相同的内容，就违反了DRY设计原则(“不要重复你自己的代码”)，
造成代码的维护困难
解决方法有如下几种：
(1)使用Web服务器的SSI（ServerSideInclude）——修改Web服务器的配置文件
(2)使用服务器端动态编程语言进行页面的包含，如PHP:
include(‘header.php‘);
....
include(‘footer.php‘);
三个PHP页面会组成一个大的响应消息，一次性返回给客户端
(3)纯前端解决方案：用frameset或iframe——尽量少使用
(4)纯前端解决方案：
使用AJAX异步请求：
产品详情页.html:
<div id="header"></div> <div>主体内容</div> <div id="footer"></div>
$(document).ready(function(){
$("#header").load("header.html"); //XHR
$("#footer").load("footer.html"); //XHR
})
(5)AngularJS中提供了一个类似于方案4的AJAX解决方案——ngInclude指令：
<div ng-include=" ‘header.html‘ ">（PS：ngInclude指令必须赋值为一个字符串！）
（PS：ng中ng-swipe-left="jump()"左滑ng-swipe-right="jump()"右滑）