javascript - 静态页面Demo项目,如何将header和footer 像PHP一样 include?
天蓬老师
天蓬老师 2017-04-10 15:30:53
[JavaScript讨论组]

静态页面Demo项目,如何将header和footer 像PHP一样 include?

天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

全部回复(12)
迷茫

最简单是用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');

ringa_lee

用前端模板配合js

天蓬老师

使用fis。有html嵌入功能,可以如下使用。

<link rel="import" href="demo.html?__inline">
高洛峰

angularjs

怪我咯

grunt+handlebars可以实现

阿神

用node打包工具,将每个页面拼起来

阿神

把后缀改为shtml

怪我咯
  a.js:


<script type="text/html" id="abc">
  aaaaaaaaaaaaaa
  </script>



  index.html:
  <script src="a.js"></script>
  <script>$('body').prepend($('#abc').html())</script>
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号