如何让html引用公共布局（多个html文件公用一个header.html和footer.html）
如何实现多个.html静态页，引用同一个header.html和footer.html文件？
直接上代码：
公共头部文件：header.html
//不用写标准的html文档格式
<div>
头部内容
</div>公共尾部文件：footer.html
//不用写标准的html文档格式
<div>
页脚内容
</div>js文件：
当前方法：通过load()函数，引入公共头部和尾部文件;
代码预览：
$(".headerpage").load("header.html");
$(".footerpage").load("footer.html");html全部文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo演示</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<!-- 顶部导航 -->
<div class="headerpage"></div>
<!--顶部导航 over-->
<!--中部主体-->
<p>···代码省略···</p>
<!--中部主体 over-->
<!--footer-->
<div class="footerpage"></div>
<!--footer over-->
<script src="js/jquery.min.js"></script>
<script>
$(function(){
/*公共部分
* 导航栏
* footer CopyRight
*/
$(".headerpage").load("header.html");
$(".footerpage").load("footer.html");
});
</script>
</body>
</html>通过上面的描述，可以发现：
在header.html和footer.html文件中，并非是标准的html文档格式！ 与此同时，通过index.html中的jQuery函数load()将上述的两个公共文件引入进来，从而形成一个完整的页面； 并且，不会影响到其他页面对于公共文件的引用和使用；以上就是关于静态html文件，使用公共头部和尾部的解决办法之一。
相关推荐
lupeng 2020-11-14
sjcheck 2020-11-10
pythonclass 2020-07-29
huzijia 2020-06-16
qsdnet我想学编程 2020-06-13
gufudhn 2020-06-06
haocxy 2020-05-28
meylovezn 2020-08-28
owhile 2020-08-18
Francismingren 2020-08-17
sunzhihaofuture 2020-07-19
爱读书的旅行者 2020-07-07
行吟阁 2020-07-05
tianqi 2020-07-05
行吟阁 2020-07-04
冰蝶 2020-07-04
lyg0 2020-07-04