參考鏈接：

http://www.cnblogs.com/jason-star/p/3345225.html

http://blog.csdn.net/jsxzzliang/article/details/47022055

?

使用SHTML進行公共頭部和底部的引用

? ? ??SHTML介紹：shtml是一種基于SSI技術的文件，也就是Server Side Include--SSI 服務器端包含指令，一些Web Server如果有SSI功能的話就會對shtml文件特殊招待，服務器會先掃一次shtml文件看沒有特殊的SSI指令存在，如果有的話就按Web Server設定規則解釋SSI指令，解釋完后跟一般html一起調去客戶端。

? ? ? ??SHTML的優點：使用ssi技術頁面生成shtml文件，只用在頭部文件位置加入<!--#include virtual="header.htm" -->/<!--#include file="header.htm" -->，其中第一個表示相對于服務器的路徑，第二個表示文件的相對路徑。然后修改的時候只要修改header.htm文件就可以了。使用shtml的好處是對搜索引擎比較友好，需要處理的文件在服務器端完成的，不會加重訪問者的瀏覽器負擔。

? ? ? ? 使用步驟：以tomcat作為服務器示例

1、找到Tomcat\conf\web.xml?文件，打開注釋?<servlet-name>ssi</servlet-name>

同時加入 <init-param>
????????? <param-name>inputEncoding</param-name>
????????? <param-value>utf-8</param-value>
??????? </init-param>
??????? <init-param>
????????? <param-name>outputEncoding</param-name>
????????? <param-value>utf-8</param-value>
??????? </init-param> 修改后效果如下： <servlet>
??????? <servlet-name>ssi</servlet-name>
??????? <servlet-class>
????????? org.apache.catalina.ssi.SSIServlet
??????? </servlet-class>
??????? <init-param>
????????? <param-name>buffered</param-name>
????????? <param-value>1</param-value>
??????? </init-param>
??????? <init-param>
????????? <param-name>debug</param-name>
????????? <param-value>0</param-value>
??????? </init-param>
????????? <init-param>
????????? <param-name>inputEncoding</param-name>
????????? <param-value>utf-8</param-value>
??????? </init-param>
??????? <init-param>
????????? <param-name>outputEncoding</param-name>
????????? <param-value>utf-8</param-value>
??????? </init-param>
??????? <init-param>
????????? <param-name>expires</param-name>
????????? <param-value>666</param-value>
??????? </init-param>
??????? <init-param>
????????? <param-name>isVirtualWebappRelative</param-name>
????????? <param-value>false</param-value>
??????? </init-param>
??????? <load-on-startup>4</load-on-startup>
??? </servlet>

?2、打開mapping，同時修改.shtml為html。修改后效果如下：

<!-- The mapping for the SSI servlet -->
??? <servlet-mapping>
??????? <servlet-name>ssi</servlet-name>
??????? <url-pattern>*.html</url-pattern>
??? </servlet-mapping> 3、修改Tomcat\conf\context.xml文件，修改效果如下： <Context>改為：<Context privileged="true">，“表示享有特權的” 4、重啟tomcat即可生效 5、頁面嵌套html 頁面1： index.html <!?DOCTYPE?html> <?html> <?head> <?meta?charset=?"UTF-8"?> <?title>?index</?title> </?head> <?body> <!--#include virtual = "common/header.html" --> </?body> </?html> 頁面二： header.html <!?DOCTYPE?html> <?html> <?head> <?meta?charset=?"UTF-8"?> <?title>?index</?title> </?head> <?body> hello world！ </?body> </?html>

?

?

?

轉載于:https://www.cnblogs.com/kelly-one/p/7784925.html

總結

以上是生活随笔為你收集整理的在html页面中引入公共的头部和底部的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。