如何正确使用Bootstrap导航栏进行导航？

Question

我想要完成的是让导航栏始终存在，并通过按导航栏上的按钮在页面的其余部分切换内容。

作为起点，我使用官方引导页面中的基本示例： http://getbootstrap.com/examples/starter-template/

因此，坚持这个例子，我只想在按下主页按钮时在导航栏下面有一个内容，按下“关于”按钮时需要另一个内容，等等...... 当然按下后按钮会突出显示（如主页按钮atm）。

为了实现这一目标，到目前为止我找到了一个解决方案，即：

• 按下按钮时将href转换为另一个html文件 <li><a href="about.html">About</a></li>
另一个html文件中的
• 与标题的代码相同，而不是另一个按钮是acitv <li class="active"><a href="about.html">About</a></li>

虽然这个解决方案正常运行但我根本不喜欢它，这就是为什么Iam在这里要求更好的方法来做到这一点。

为什么我不喜欢我目前的解决方案：

• 极其多余。当导航栏中有许多按钮并且我想对导航栏进行更改时，我将不得不在每个按钮的所有复制版本中进行更改
• 不必要地加载html代码。不足以加载导航栏一次，然后在交互时动态更改它吗？

提前多多感谢。