极客观点
项目管理
HarmonyOS
静态页面Demo项目，如何将header和footer 像PHP一样 include？
最简单是用iframe
<IFRAME NAME="header_frame" width=100% height=30 marginwidth=0 marginheight=0 SRC="thefooter.html" ></IFRAME>
你可以试一下shtml，就是常说的服务器端包含（SSI）。
我以前就是用这种方法来做的个人网站，效果不错。
以下引用百度百科
主要有以下几种用途：
1．显示服务器端环境变量<#echo>
2．将文本内容直接插入到文档中<#include>
3．显示WEB文档相关信息<#flastmod #fsize> (如文件制作日期/大小等)
4．直接执行服务器上的各种程序<#exec>(如CGI或其他可执行程序)
5．设置SSI信息显示格式<#config>(如文件制作日期/大小显示方式) 高级SSI可设置变量使用if条件语句。
a.js:
<script type="text/html" id="abc">
aaaaaaaaaaaaaa
</script>
index.html:
<script src="a.js"></script>
<script>$('body').prepend($('#abc').html())</script>
1)在HTML页面中
<html>
<head>
<script type="text/javascript" src="script/page_global.js"></script>
</head>
<body>
<div id="page_header">公共header</div>
<div id="page_main">特定页面内容</div>
<div id="page_footer">公共footer</div>
</body>
</html>
2)page_global.JS脚本
$(function(){
var footerHTML="静态HTML内容";//或者此部分内容通过AJAX动态load
//$('#page_header').empty().html('~~~~公共Header内容~~~~');
//$('#page_footer').empty().html('~~~~公共Footer内容~~~~');
$('#page_header').html('~~~~公共Header内容~~~~');
$('#page_footer').html('~~~~公共Footer内容~~~~');
));
希望能帮到你~~~
撰写回答
你尚未登录，登录后可以
- 和开发者交流问题的细节
- 关注并接收问题和回答的更新提醒
- 参与内容的编辑和改进，让解决方法与时俱进
推荐问题
js 如何将Key属性相同的放在同一个数组？
{代码...} 说明：id和name是动态的，有可能后台返回的是age和school,不是固定id和name想要的结果是; {代码...}9 回答9.4k 阅读
省市区街道数据在哪里可以下载？
省市区街道数据在哪里可以下载？6 回答5.1k 阅读✓ 已解决
两个promise问题？
第一个问题，这个为什么先输出3后输出2呢 {代码...} 第二个问题，这个为什么会交错输出呢，142536 {代码...} promise小白一枚，上述两个疑问，希望能得到详细的解答5 回答3.7k 阅读✓ 已解决
如何自定义设置虚线边框的样式？
背景： {代码...} 如上图所示：虽然可以设置虚线边框，但是虚线边框的样式往往需要修改：比如:单个实线间的间距自定义调整;单个实线的长度自定义调整。5 回答8.1k 阅读✓ 已解决
Object assgin拷贝问题？
{代码...} 为什么这段代码会输出 {代码...} 而不是 {代码...} 呢？4 回答8k 阅读✓ 已解决
js如何在并发中同步两个fetch请求？
请求A的结果是B的参数，所以AB只能是同步请求，但有假设有100个AB请求，如何构造并发请求呢？ {代码...} 这个代码完全不行，等待时间太长了。假设一组AB耗时2s，上面的代码需要等待近1min才能获得数据，我希望能获得一组AB就显示一张图片，类似并行处理同步的AB？谢谢！7 回答10.1k 阅读
怎么把一个矩形div变成一个直角三角形？
下面的是一个正常的div，怎么变成浅角部分，就是把一个矩形的div变成下面是直角的直角三角形。5 回答7.7k 阅读
宣传栏
最简单的用SSI！
Apache httped和Nginx都有配置SSI的方法。
SSI不仅能够设置简单包含，还有变量指令等，做demo足够了。至于Nginx和Apache httped分别如何配置，请百度，不再赘述。
另外推荐一款基于nodejs、gulp的自动化插件 fas ，已集成支持SSI的http服务器 ， 集成node-sass：
https://github.com/fas-team/fas