84669 人學習
152542 人學習
20005 人學習
5487 人學習
7821 人學習
359900 人學習
3350 人學習
180660 人學習
48569 人學習
18603 人學習
40936 人學習
1549 人學習
1183 人學習
32909 人學習
静态页面Demo项目,如何将header和footer 像PHP一样 include?
欢迎选择我的课程,让我们一起见证您的进步~~
最简单的用SSI!
Apache httped和Nginx都有配置SSI的方法。
SSI不仅能够设置简单包含,还有变量指令等,做demo足够了。至于Nginx和Apache httped分别如何配置,请百度,不再赘述。
另外推荐一款基于nodejs、gulp的自动化插件 fas ,已集成支持SSI的http服务器 , 集成node-sass:
https://github.com/fas-team/fas
最简单是用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条件语句。
可以用jquery的load方法,直接将需要的文件加载到页面中。 $('className').load('page/header.html');
可以试一下:https://github.com/vanetix/grunt-includes
用前端模板配合js
使用fis。有html嵌入功能,可以如下使用。
<link rel="import" href="demo.html?__inline">
angularjs
grunt+handlebars可以实现
用node打包工具,将每个页面拼起来
最简单的用SSI!
Apache httped和Nginx都有配置SSI的方法。
SSI不仅能够设置简单包含,还有变量指令等,做demo足够了。至于Nginx和Apache httped分别如何配置,请百度,不再赘述。
另外推荐一款基于nodejs、gulp的自动化插件 fas ,已集成支持SSI的http服务器 , 集成node-sass:
https://github.com/fas-team/fas
最简单是用iframe
你可以试一下shtml,就是常说的服务器端包含(SSI)。
我以前就是用这种方法来做的个人网站,效果不错。
以下引用百度百科
主要有以下几种用途:
1.显示服务器端环境变量<#echo>
2.将文本内容直接插入到文档中<#include>
3.显示WEB文档相关信息<#flastmod #fsize> (如文件制作日期/大小等)
4.直接执行服务器上的各种程序<#exec>(如CGI或其他可执行程序)
5.设置SSI信息显示格式<#config>(如文件制作日期/大小显示方式) 高级SSI可设置变量使用if条件语句。
可以用jquery的load方法,直接将需要的文件加载到页面中。
$('className').load('page/header.html');
可以试一下:https://github.com/vanetix/grunt-includes
用前端模板配合js
使用fis。有html嵌入功能,可以如下使用。
angularjs
grunt+handlebars可以实现
用node打包工具,将每个页面拼起来