我们如何才能改变网页的内部？ [英] How can we change only inner part of a web page?
问题描述
我正在开发一个Web应用程序，所有页面的页眉和页脚都是相同的。我想要实现的是，当单击标题中的按钮时，只更改页眉和页脚之间的页面部分。例如，主页，活动和区域有3个按钮。如果我点击活动，页面的页眉和页脚应该保持不变，活动页面应该位于页眉和页脚之间。我该怎么做？
I am developing a web application, where headers and footers for all pages are the same. What I want to achieve, is to change only the part of the page between the header and the footer when a button in the header is clicked. For example, there are 3 buttons Home, Activities and Areas. If I click activities then header and footer of the page should remain the same and activities page should come in between header and footer. How can I do that?
推荐答案
我同意rlemon。我认为你正在寻找jQuery / AJAX。例如：
I agree with rlemon. I think jQuery/AJAX is what you are looking for. For example:
<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将用作一个模板。包含我想要动态加载的内容。
In this simple implementation, I have just created 2 simple HTML pages, index.html will be used as a template. And activities.html, which contains the content I want to load dynamically.
因此，如果我单击活动，它应该加载activities.html而不重新加载整个页面。
Therefore, if I click Activities, it should load activities.html into without reloading the entire page.
您可以从 jquery.org
我还没有测试过，但它应该可以工作。
I haven't tested this, but it should work.
希望它有帮助： - ）
Hope it helps :-)
这篇关于我们如何才能改变网页的内部？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
