如何抽离、引用公共部分页面

产生背景：

昨天下午刚接通知，需要新开发一个bootstrap+ace 自适应后台项目，用ace做一个初构。在做项目的时候经常会遇到一样的头部和底部，如果每个页面都复制一遍，不仅工作量大而且万一需要修改一下文章就更麻烦了，这时候就需要我们把公共部分提取出来，等需要的时候再引入页面。所以先考虑做的抽离页面，然后引用，这样可以自由拼凑，方便复用。

页面抽离及引入：

使用jQ的load函数（公司项目一直用的JQ，出于兼容性原因）

<!--在引入页面-->
<div class="footer"></div>

/*导入脚部页面*/
$(document).ready(function(){
   $(".footer").load("page/footer.html");
});

<!--抽离footer.html页面，做被引入页面-->
<footer>
   <ul class="g-flex">
      <li><a href="#">活动XXX</a></li>
      <li><a href="#">列表XXX</a></li>
      <li><a href="#">产权XXX</a></li>
      <li><a href="#">我们XXX</a></li>
   </ul>
</footer>

• 注意，此时的footer.html不需要是完整的HTML（这个大坑，特此标注），这包含标签内容即可。

方法还有很多，有时间会更新补全。在此只是做笔记，补一下一年前的记忆，告辞~