在静态页面中调用共有的部分，如头部和尾部

最近一直在想一个问题，就是布局多个静态页面的时候，头部和尾部都是一样的时候，如果有头部或尾部有修改的时候，这下就是一件麻烦事了，就要一个页面一个页面的修改，页面要是少还可以接受，要是多的话，就头疼的节奏，我就想了解一下有没有什么方法可以解决这个问题的，就在网上找了很多，一般都是说后台调用，还有就是使用js和iframe引入，我之前使用过iframe，但是我不怎么喜欢使用iframe，可能是之前使用的方法不对，用的感觉样式调控好麻烦，所以就此有不喜欢的感觉。

我看到了使用js的方法，我就使用了这个方法试了一下，感觉挺简单的，但是不知道这样弄对后台有没有什么影响。

js方法：

html:

<div id="head"></div>

js:

$(function(){

         var htm = '<div class="head'>头部内容</div>';

        $("#head").append(htm);

)}

iframe方法：

新建一个html文件，

html:把共有的部分写在这个文件中，之后在页面中需要的部分使用iframe引入

<iframe src="head.html" ></iframe>

后台的方法：

新建一个html文件，

html:把共有的部分写在这个文件中，之后在页面中需要的部分使用include引入

<# include "/contorl/head.jsp"/>

如果有写错的地方多多指教