有一些网站的头部和底部都是一样的,把公共头部和底部分离,使用时引用比重复写在每个页面好的多。实现方法如下:

第一步:把公共的头部和底部分别写在header.html和footer.htmlr中,公共js中写

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

第二步:每个页面整体布局,页面引入公共的js文件

<div class="box">
    <div class="header"></div>
    <div class="cont"></div>
    <div class="footer"></div>
</div>

这样就完成了静态页面公共头部和底部的引用。

注意:也是在使用中遇到的问题,在header.html中不免引用到图片(比如logo),这时候logo的引用地址不能是header.html对应的相对路径,而应该是哪个页面用到对应此页面的相对路径。

 

相关文章:

  • 2022-12-23
  • 2021-10-21
  • 2021-06-01
  • 2021-04-12
  • 2021-04-05
  • 2022-12-23
  • 2023-01-13
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-01-24
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-03-05
  • 2021-06-25
相关资源
相似解决方案