引用html公共部分的方法

 1. 使用iframe标签

   <!-- 顶部导航 -->

 <div class="headerpage" style="position:absolute;z-index:999;width: 100%;">

   <iframe src="./header.html" frameborder="0" scrolling="no" width="100%" height="500px" ></iframe>

 </div>

<!-- 尾部 -->

<div class="footerpage"  style="position:relative; width: 100%;">

  <iframe src="./footer.html" frameborder="0" scrolling="no" width="100%" height="450px"></iframe>

</div>

2. 使用jquery提供的load方法

   <!-- 顶部导航 -->

 <div class="headerpage" style="position:absolute;z-index:999;width: 100%; height: 500px;">

 </div>

 <script>

  $(function(){

    $(".headerpage").load("header.html");

  })