javascript - 我们如何才能只更改网页的内部部分？

标签 javascript jquery html

我正在开发一个 Web 应用程序，其中所有页面的页眉和页脚都相同。我想要实现的是单击页眉中的按钮时仅更改页眉和页脚之间的页面部分。例如，有 3 个按钮 Home、Activities 和 Areas。如果我单击事件，则页面的页眉和页脚应保持不变，事件页面应位于页眉和页脚之间。我该怎么做？

最佳答案

我同意 rlemon。我认为 jQuery/AJAX 是您正在寻找的。例如:

<html>
    <head>
        <!-- Include Jquery here in a script tag -->
        <script type="text/javascript">
            $(document).ready(function(){
                 $("#activities").click(function(){
                     $("#body").load("activities.html");
                 });
            });
        </script>
    </head>
    <body>
        <div id="header">
            <a href="#" id="activities">Activities</a>
            <!-- this stays the same -->
        </div>
        <div id="body">

            <!-- All content will be loaded here dynamically -->

        </div>
        <div id="footer">
            <!-- this stays the same -->
        </div>
    </body>
</html>

在这个简单的实现中，我刚刚创建了 2 个简单的 HTML 页面，index.html 将用作模板。还有activities.html，里面包含了我要动态加载的内容。

因此，如果我点击 Activities，它应该加载 activities.html 而无需重新加载整个页面。

您可以从jquery.org 下载jquery 库。

我还没有测试过这个，但它应该可以工作。

希望对您有所帮助:-)

关于javascript - 我们如何才能只更改网页的内部部分？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8079618/