html 引入一个公共的头部和底部

版权声明:JiahaoZhang原创文章,转载请注明出处 https://blog.csdn.net/GrootBaby/article/details/83991406

一、asp语言和PHP语言

首先制作一个头部文件head.asp,或者一个底部文件foot.asp。如主页是index.asp,调用头部代码是在index.asp文件代码的开始位置(第一个标记后面,<head>标记前面)增加如下代码:

<!–  #include file="head.asp"  –> 

如果是PHP文件,文件名改为 head.php即可

二、html语言(使用iframe框架来实现)

<iframe MARGINWIDTH=0 MARGINHEIGHT=0 HSPACE=0 VSPACE=0 FRAMEBORDER=0 SCROLLING=no src="head.htm" height="auto" width="100%">
</iframe>

三、script语言(使用.js脚本来实现)

建立一个head.js的文件,找一个html转js的网站,然后把你头部的html代码转化成js代码,并放在head.js文件里面。然后在需要调用head文件代码的地方添加如下代码:

转换工具:http://tool.chinaz.com/Tools/Html_Js.aspx

<script language="javascript" type="text/javascript" src="js/head.js"></script>

四、jQuery的load函数

需要注意的是,此时的header.html或footer.html不需要是完整的HTML,这里添加标签内内容即可

/*导入头部和尾部*/
$(document).ready(function(){
   $(".header").load("ssi/header.html");
});

五、HTML中执行include file 

web服务器(比如IIS)中设定包含

<!--#include file="header.htm" -->

使用ssi技术页面生成shtml文件,只用在头部文件位置加入如上述代码,然后修改的时候只要修改header.htm文件就可以了。

**使用shtml的好处是对搜索引擎比较友好,需要处理的文件在服务器端完成的, 不会加重访问者的浏览器负担。

SSI(Server Side Include),通常称为"服务器端嵌入"或"服务器端包含",是一种类似于ASP的基于服务器的网页制作技术。默认扩展名是 .stm、.shtm 和 .shtml。SSI就是在HTML文件中,可以通过注释行调用的命令或指针,SSI具有 强大的功能,只要使用一条简单的SSI命令就可以实现整个网站的内容更新,时间和日期的动态显示,以及执行shell和CGI脚本程序等复杂的功能

六、ajax动态拉取填充

七、angular js里的<ng-include>的使用

猜你喜欢

转载自blog.csdn.net/GrootBaby/article/details/83991406