如何在HTML不同的页面中,共用头部与尾部?

方法1:embed属性要设置宽高

<embed type="text/html" src="header.html" />

方法2:使用jQuery的load函数

注意:此时的footer.html不需要是完整的HTML,这包含标签内容即可

/*导入头部和尾部*/ 

$(document).ready(function(){

  $(".footer").load("footer.html"); 

}

<!--footer.html页面-->

<footer>

  <ul class="g-flex">

    <li class="g-flex-auto"><a href="#" class="i-b">首页</a></li>

    <li class="g-flex-auto"><a href="#" class="i-b">分类</a></li>

    <li class="g-flex-auto"><a href="#" class="i-b">订单</a></li>

    <li class="g-flex-auto"><a href="#" class="i-b">我的</a></li>

  </ul>

</footer>

原文地址:https://www.cnblogs.com/fanting/p/9353548.html