在所有页面中包含导航栏的最佳方法是什么？

Question

我正在考虑一种向所有网页添加导航栏的方法，并且当我更新文件时，所有页面也都应该更新。
我在Google上进行了一段时间的研究，发现：

• PHP
• SSI （我什至不知道这是什么）
• JavaScript

但是哪个是最好的？ 有人可以解释什么是SSI吗？

Answer 1

SSI（服务器端包含）已过时。 我建议不要使用它们。 JavaScript可以使用，但是您的浏览器必须下载其他文件才能构建页面。 另外，禁用JavaScript的人将无法浏览您的网站。 使用JavaScript构造页面确实没有任何意义，因此除非需要特殊效果，否则不要使用它。

PHP是最好的选择。 您只需要在页面顶部添加导航脚本，例如include_once('nav.php'); 。

Answer 2

But which one is the best这取决于您在网站上已经使用了什么。

如果它是用php编写的，那么最好使用php。 通过简单的include('file_with_nav_bars_code'); 在模板或代码的正确位置，您可以插入静态html代码或上述文件生成的代码。

SSI（服务器端包含）适合“静态”页面。 这就像一个简单的脚本，可以由服务器在进行一些设置后完成。 如果检查Apache服务器错误页面的模板，您将在此处看到SSI指令，其中包括页脚，标头，输出一些基本信息，例如时间，请求的URL等。 包含一些代码看起来就像<!--#include virtual="/file_with_nav_bars_code" -->一样，您甚至可以包含一些CGI脚本<!--#exec cgi="/cgi-bin/example.cgi" -->在此处http://httpd.apache.org/docs/2.0/howto/ssi.html和此处http://en.wikipedia.org/wiki/Server_Side_Includes了解更多信息

javascript也适用于静态页面。 您必须加载javascript代码，以“生成”所需的html代码，并将其输出到所需页面上的相应位置。 它有一个严重的负面影响-搜索引擎将无法跟随js生成的链接，因为它们将无法运行它（因为js的访问者已关闭，但我不知道这种情况。甚至Opera mini都能够呈现简单js输出的结果）。 简单的方法是将js脚本包含在您要具有导航栏的位置： <script src='nav_bar.js'></script> ，在nav_bar.js您将（作为一个非常简单的示例）类似这： document.write('some html code of the bar here, with escaped new lines and quotes');

ps：多年的经验我都尝试过所有方法：）我在早期的静态页面上使用了js和SSI，现在我仅使用php和其他服务器端脚本语言。 您仍然可以将javascript与php生成的页面一起使用，但是对于SSI，您必须告诉Web服务器将php的输出再传递一次以查找SSI指令，而不是将其返回给浏览器。

Answer 3

PHP

PHP可以正常工作，但是使用它意味着您必须进行一些不同的设置，包括执行以下操作：

• 在服务器上运行PHP
• 将.html文件重命名为.php
• 更改链接以指向.php文件
• 至少了解有关PHP的知识以使用require

SSI

SSI（服务器端包含）是​​没人使用的古老事物。 不要使用它们。 但是，如果您感到好奇，请查看mod_include 。

使用Javascript

可以使客户端javascript正常工作，但是最好在服务器上执行这种操作。

---

这里是其他一些可供考虑的选项。

另一种服务器端语言

PHP不是唯一的服务器端语言。 您可能更喜欢python，ruby，服务器端javascript等。

XSLT

XSL转换非常适合这种模板，可以通过浏览器或在服务器上应用。 跨浏览器的支持很好，并且已经有一段时间了。 诸如“ noscript”之类的扩展往往会破坏某些浏览器中的XSL转换，因此，通常尽可能在服务器上应用它们。

iframe骇客

您只需将导航放在单独的HTML文件中，然后将其包含在每个页面的iframe 。 仅将此作为最后的手段。 如果您不能使用服务器端语言，不能或不想使用XSLT，并且页面相对较少，则可以正常工作。 否则，请勿这样做。

Answer 4

SSI仍然可以使用v函数或％（在Apache / 2.4.18上测试）在现代服务器上运行。

示例（导航包括）：

<!--#include file="nav.html" -->

活动菜单项示例（如果对文档名称进行测试）：

<!--#if expr='v("DOCUMENT_NAME")=~/about.html/'-->
<a class="active" href="#">
<!--#else -->
<a href="about.html">
<!--#endif -->
About</a>

示例2（如果在文档路径上进行测试）：

<!--#if expr="%{DOCUMENT_URI} =~ /product/"-->
Product path
<!--#else-->
Some other path
<!--#endif-->

.htaccess使SSI工作（示例）：

AddType text/html .shtml
AddHandler server-parsed .html
AddHandler server-parsed .shtml
Options Indexes FollowSymLinks Includes

较旧的Apache版本使用不同的expr语法。

Answer 5

SSI代表服务器端包含，该概念意味着您的文件将全部包含相同的文件（例如，对于导航栏），因此，当您对该文件进行任何更改时，它将反映在您的所有页面中。

PHP和javascript是两种不同的事物，PHP是一种服务器端语言，而javascript是一种客户端语言。

如果您只想要一个导航栏，那么PHP就足够了。 但是，如果您想在部分下添加任何客户端功能（如弹出菜单），您也必须使用javascript。