如何将网站的页眉和页脚存储在一个位置？

Question

我总是在重写页眉和页脚，对于每次编辑，我都必须手动将所有代码复制并粘贴到网页中。 显然这是错误的方法，但是我不确定正确的方法。 我当前的想法是先创建一个“ header”和“ footer” div，然后使用jquery的$（document）.ready将divs与代码一起加载。 恐怕它会很慢，因为它会在执行页眉/页脚代码之前等待整个页面呈现。 解决此问题的常用方法是什么？

Answer 1

听起来您需要一些服务器端技术。 选择哪个选项（取决于您的选择）取决于您和您的主机。 您的主机很可能会支持PHP和SSI（服务器端包含）。

在最简单的设置中，基本上将通用代码放入单个文件中，例如header.inc和footer.inc 。 这些文件的名称或扩展名无关紧要。

对于PHP，您的页面现在应该是*.php而不是*.html并且您需要编写以下代码：

<?php include('header.inc'); ?>
<p>
    Here is your regular document.
</p>
<?php include('footer.inc'); ?>

对于SSI，您无需更改文件名，代码如下所示：

<!--#include virtual="header.inc" -->
<p>
    Here is your regular document.
</p>
<!--#include virtual="footer.inc" -->

Answer 2

您绝对不想使用Javascript执行此操作。 首先，在执行Javascript之前，不会加载页眉和页脚，但更重要的是，未启用Javascript的任何人都根本看不到它们（并且要求Javascript查看静态页面没有意义）。

有两种简单的方法可以做到这一点：

1）使用类似php的服务器端语言来包含页脚：

<?php
  include('header.html');
?>
The rest of the page goes here
<?php
  include('footer.html');
?>

2）使用生成静态页面的构建/部署过程。 这将与1）类似，但是每个构建只执行一次，而不是每次有人点击页面时都执行一次。

Answer 3

通常，有一些服务器端模板技术正在使用中，例如PHP，JSP或XSL。 使用这些方法之一，创建可链接的可重用代码段非常简单。

对于纯HTML + JS方法，可以使用IFRAME链接到独立的页眉和页脚HTML文件。 这样一来，您就可以将所有页眉和页脚信息保留在一个位置，而只需更新一次即可。

Answer 4

常见的方法是使用服务器端语言，例如PHP 。 或者，如果只需要包含页脚和页眉，则可以使用SSI

Answer 5

使用HTML或PHP包含。