如何将一个HTML页面嵌套在另一个页面中

墨裔

这个在做网页中常要用到，有些通用的内容可集中放在一个页面文件中，其它要用到这些内容的页面只需要包含（引用）这个通用文件即可。这样便于维护，如果有很多网页，当通用内容需要修改时，只改一个文件就可以了，不需要每个文件单独修改。

最典型的应用比如页脚的版权信息等内容可以放在一个叫做footer.html文件里， 然后其他页面文件在页面内容的最后包含这个文件就可以了，具体例子下面有。

要html文件嵌套，最简单的办法是使用SSI（Server Side Include)技术，也就是在服务器端两个文件就被合并了。除了少数免费网页寄存服务外，几乎所有的网页寄存服务器都支持 SSI。这也是一个比较推荐的方法，它与ASP和ASP.NET网页使用的语法一模一样。如果网站管理员偏向使用PHP或JSP的话，语法会稍有不同。

对于不能使用SSI、ASP、ASP.NET、PHP和JSP等服务器端动态页面语言的情况，这里还将介绍两种客户端镶嵌的办法：JavaScript和iframe的方法。当这两种客户端的方法都有很大的弊病，一般不推荐使用。

---

1、SSI (Server Side Include)

SSI是一种简单的动态网页制作技术，但是有些服务器要求网页文件扩展名为.shtml才能识别文件中SSI命令。所以如果你的SSI命令看起来不工作，先别放弃，试着把文件扩展名改为.shtml，也许会成功。如果知道自己的服务器是否支持SSI，请看另一篇文章。

使用SSI一个局限性是页面一定要放在网页服务器上才能看到效果，在本地是不好调试的。当然，如果非要在本地调试，就本地装一个Apache服务器好了。

比如你想在每个网页的底部加上同样的版权信息，像

© 2009 程序员实验室 版权所有

可以把这行信息放到一个叫做footer.html的文件里，footer.html的内容为：

<center> &#169; 程序员实验室 版权所有</center>;

这样同一路径下的其他页面文件要包含footer.html的SSI命令是：

1. <!- #include virtual="footer.html" ->   //（常用）

复制代码

或者

1. <!- #include file="footer.html" ->

复制代码

这两者的几乎是一样的，不同之处在于include virtual后面取的是一个URL形式的路径，甚至还可以执行一个CGI程序并包含其输出结果，如果你的服务器支持CGI的话。而include file后面取的是一个文件系统路径，并且不能执行CGI程序。两者都可以接受相对路径，所以对上面这个简单例子，两者的效果是一样的。如果你不知道URL路径与文件系统路径两者的区别的话，就用include virtual

更多关于SSI的介绍，请看这篇SSI的介绍文章。

---

2、PHP

如果你的服务器支持PHP的话，用PHP引用footer.html文件的写法如下：

1. <?php include("footer.html"); ?>

复制代码

这句命令所在的文件扩展名必须被为.php。

除了引用本服务器上的文件，PHP的include命令还可以用来引用其它网站上的html文件，比如：

1. <?php include(http://www.prglab.com/examples/footer.html); ?>

复制代码

当然你要得到其它网站的允许才能引用别人的文件

---

3、ASP和ASP.NET

如果你使用的是老式的ASP，则语法是与上面SSI一样的，不需要任何修改，只要把命令所在文件的扩展名改为.asp即可。

对于ASP.NET，也是类似，不同之处在于，因为SSI命令是在ASP命令运行之前被首先编译，所以文件名中不能够使用ASP.NET的变量。如果一定要用的话，就用ASP.NET的命令来做文件嵌套吧。

比如：

1. <%
   
2. 
   
3.     Response.WriteFile ("footer.html")
   
4. 
   
5. %>

复制代码

更多关于怎样在ASP.NET中实现动态文件嵌套，请参考微软的这篇文章。

---

4、JSP （Java Server Page)

JSP文件需要在基于Java的服务器上运行，比如Apache Tomcat。JSP包含文件的语法是：

1. <%@ include file="footer.html" %>

复制代码

---

5、客户端包含(依赖于浏览器的包含就叫做客户端包含)

客户端包含有两种方式：JavaScript和iframe。让我们先看看两种方法各有什么利弊。

Javascript:    两种方法中Javascript生成的页面格式比较好，Javascript可以从一个URL取到页面片断然后镶嵌在另一个页面的任何位置 。其结果与服务器端包含的结果基本上一样，但弊端是客户端必须开启Javascript功能（目前大多数人是选择开启的，但也有少数出于安全方面的考虑不开启）。另一个弊端是搜索引擎是看不到由Javascript包含的页面的内容的，这对你的网站推广比较不利。(墨裔:SEO不利BUFF)

iframe:    使用iframe比较简单，它可以强制一个HTML页面镶嵌在另一个页面中，类似于是用 object 控件将 Flash 电影、录像、或者MP3播放器嵌入一个页面中。使用iframe，用户端不需要开启Javascript功能。但不利的方面是iframe有固定的高度和宽度，不能随着被嵌入页面的大小而改变。当被嵌入页面大于给定高宽度时，会显示滚动条(当然你也可以使用 scrolling = "no" 来强制滚动条不显示，但这样页面内容会显示不完整)，影响页面美观。另外就是搜索引擎可能不收录iframe引用的页面，不利网站推广。(搜索不收录)

方法因为淘汰而缺省