在所有页面上使用单个导航栏,而不复制它?
Using single nav bar on all pages, without coping it?
是否可以在所有页面上使用相同的导航栏,而无需复制和粘贴代码。基本上我想要这个:
<nav class="navbar navbar-default">
<ul class="nav navbar-nav">
<li><a href="index.html">Home</a></li>
<li><a href="login.html">Login</a></li>
<li><a href="register.html">Register</a></li>
</ul>
</nav>
在所有三个页面上(主页、登录、注册)。无需复制和粘贴代码。
许多模板系统允许您嵌套或继承模板。例如,您将导航栏放在主模板中,然后在所有页面上简单地继承该模板。 Jade 和 Jinja 是我想到的两个。
如果您不使用任何类型的模板系统,您仍然可以将 HTML 文件与您使用的任何语言拼凑在一起,但这会有点混乱。例如,读取多个 HTML 文件,将它们连接起来,然后将它们提供给客户端。
最后但并非最不重要的一点是,您可以将导航栏动态添加到页面,只需在您希望导航栏出现的所有页面上包含相同的脚本即可。
最后,你最好的选择是使用模板系统,因为它可以非常高效和干净地为你处理这样的事情,但即使没有模板系统你仍然可以管理,只是没有那么干净。
您可以使用 Javascript 框架来帮助您实现这一目标。
Javascript Angular JS 等框架提供的功能可以帮助您做到这一点。
是否可以在所有页面上使用相同的导航栏,而无需复制和粘贴代码。基本上我想要这个:
<nav class="navbar navbar-default">
<ul class="nav navbar-nav">
<li><a href="index.html">Home</a></li>
<li><a href="login.html">Login</a></li>
<li><a href="register.html">Register</a></li>
</ul>
</nav>
在所有三个页面上(主页、登录、注册)。无需复制和粘贴代码。
许多模板系统允许您嵌套或继承模板。例如,您将导航栏放在主模板中,然后在所有页面上简单地继承该模板。 Jade 和 Jinja 是我想到的两个。
如果您不使用任何类型的模板系统,您仍然可以将 HTML 文件与您使用的任何语言拼凑在一起,但这会有点混乱。例如,读取多个 HTML 文件,将它们连接起来,然后将它们提供给客户端。
最后但并非最不重要的一点是,您可以将导航栏动态添加到页面,只需在您希望导航栏出现的所有页面上包含相同的脚本即可。
最后,你最好的选择是使用模板系统,因为它可以非常高效和干净地为你处理这样的事情,但即使没有模板系统你仍然可以管理,只是没有那么干净。
您可以使用 Javascript 框架来帮助您实现这一目标。
Javascript Angular JS 等框架提供的功能可以帮助您做到这一点。