在我们写项目的时候，会遇到一个模块在多个页面使用，如果没有页面都写一次，那就太费劲了。
如果你使用了框架（vue，react，Angular）的话，那框架都有模块化，可以轻松解决。
如果你使用原生开发的话，怎么办呢？
传统的纯 js 做法可以使用
var content = document.getElementById("content");
content.innerHTML("一大坨HTML代码")
就是重新绘制那部分DIV，当然往往我们的需要写很多标签，很不爽。
服务端渲染
在做Java项目时，我们可以采用多种方法对页面进行模块化。
例如，使用JSP时，我们可以这样引入一个片段：
<%@ include file="page.jsp" %>
但是需要后台支持。
jQuery的load()方法
load方法使用很简单
$("#id").load("param") 这个 param 可以直接指定某个 url ，必须在是本服务器可以请求的页面哦
注意：load方法不能在本地去加载一个页面，必须在是同一个服务器上。
文件目录（本地起了一个node服务测试的）
footer页面
比如：现在我们有个footer，需要在多个页面使用。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>test</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> </head> <body> <h1>测试</h1> <!-- 公共尾部 --> <footer id="footer"></footer> </body> <script> $(function(){ $('#footer').load('footer.html'); }) </script> </html>
效果图：这时我们已经吧footer插入到 test.html了
