在一个html页面中加载不同的页面？

Question

我正在使用Bootstrap构建管理页面。在管理页面中，我有一个侧面菜单和一个内容块，我想在点击时将当前菜单项更改为“活动”类，并根据菜单项显示不同的内容。目前，每个菜单项都有不同的html页面。我觉得这很不方便，因为如果我想在侧边菜单中更改某些内容，或者所有页面都有共同点的内容，我必须对每个html脚本进行相同的更改。因此，我正在考虑让一个父html页面显示不同的内容，具体取决于单击的菜单项。很简单的东西，虽然有很多方法可以做到这一点，例如使用iframe，使用JS显示和隐藏不同的div，或者使用链接加载内容等等。

不同方法有哪些缺点和好处，哪一种最常用？

以下是一些示例代码：

<section class="sidebar">
    <ul class="sidebar-menu">
        <li class="active">
            <a href="overview.html">Overview</a>
        </li>              
        <li>
            <a href="theme.html">Theme</a>
        </li>
    </ul>
</section>

<section class="content">
    Content
</section>

Answer 1

这个问题与bootstrap没什么关系。 许多框架允许使用模板页面，因此您无需重复每个页面共有的代码。我强烈建议使用某种模板或允许它的框架。

我绝对会避免使用iframe。使用Javascript框架是一个很好的解决方案。我会查看像meteor js或angular js这样的框架，它们可以让你创建单页面应用程序，并轻松更改页面的主要内容，而无需重新加载页面。