Question

目前，我的网站使用静态手写HTML页面。我手动将导航菜单添加到所有页面。我希望能够维护单个用户资源文件，其中包含菜单的HTML代码以及网站上所有其他HTML文件对此文件的引用。我知道我们可以使用服务器端包含和客户端包括这样做。但在阅读了每种方法的优缺点之后，我对我应该采用哪种方法感到困惑。

P.S。我的服务器不是PHP服务器。

谢谢！

Answer 1

最后，您希望网站加载速度更快，易于维护。如果您使用客户端javascript来执行AJAX以获取模块/小部件，那么您将添加更多的http请求，并且该站点将明显变慢。使用服务器来组合页面是有效的，但是你失去了javascript动画和AJAX的优势。服务器和客户端的混合可能令人困惑，但可能是最佳的。如果您的服务器是Node.JS，那么您将拥有巨大的优势，因为服务器上的相同功能可以配置为适用于客户端。

例如，您可以将服务器用于组装导航栏作为索引文件的一部分，并在用户通过ajax登录后使用客户端加载更新的导航栏等内容。可以在Node和浏览器中使用相同的功能 - 例如，jQuery或YUI在节点中可用。

所以这真的取决于你的服务器，以及你想做多少工作。

到目前为止，我能给你的最简单，最快捷的解决方案是使用服务器端模板。不了解您的服务器，使用jQuery和load方法对于客户端模板加载很有用。

http://docs.jquery.com/Ajax/load

Answer 2

平面HTML文件不能相互包含在内。您将不得不使用一种或另一种服务器端脚本语言。

你的服务器有点像Apache（Linux）吗？如果是的话，它可能会启用php。请咨询您的托管服务提供商。

但可能是，经验法则如下（适用于任何后端框架，但详细说明为php）：

1）在一个HTML页面上编写导航代码

2）将它保存为一个php文件（或者按照程序，无论你有什么服务器端 - 从现在开始我继续假设你将使用php）

3）将所有页面保存为.php，以便能够包含新的可重用元素

4）用php include语句替换所有页面中的nav部分HTML，包括导航文件，例如nav.php 例如，

  include( $path . 'nav.php')

5）如果你想包括“你在这里”突出显示， a）在所有页面上的body标签上设置id b）在你所包含的nav.php中的每个链接上设置一个id

6）在你的CSS中，列出所有可能的页面ID和组合的组合。导航链接ID，例如

  #homepage #homeLink, 
  #contactPage #contactLink,
  #aboutPage #aboutLink {

  /* format your "active" nav link here */

  }

Answer 3

或者您可以使用Jquery的.load（）函数将另一个文本文件加载到nav中（如果在txt文件中使用html标记，则将其加载为html）但如果用户禁用了JavaScript，这将无用。 / p>

请参阅下面的Jquery文档链接

http://api.jquery.com/load/

将可重复使用的导航菜单添加到HTML页面

3 个答案: