搜索引擎友好的AJAX驱动网站：

基本示例：

header.php

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>AJAX driven site - by Roko C.B. - TEST</title>
</head>
<body>
<?php include 'menu.html'; ?>

menu.html

<ul id="nav">
    <li><a href="index.php"> HOME </a></li> 
    <li><a href="foo.php"> FOO </a></li>
    <li><a href="bar.php"> BAR </a></li>  
</ul>

footer.php

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script>
$(function(){ // DOM Ready (shorthand)
    window.onpopstate = function(e) {
        if(e.state){
            $("#content").html( e.state.html );
            document.title = e.state.pageTitle;
        }
    };
  $('#nav a').click(function(e) {
  
      e.preventDefault();                // prevent default anchor behavior
      var URL = $(this).attr('href');    // get page URL
      $('#page').html('');               // empty old HTML content.
      // Target URL and get the #content element
      // and put it into #page of this page
      $('#page').load(URL +' #content', function(data){
           // Load callback function.
           // Everything here will be performed once the load is done.
           // Put here whatever you need.
           // ...
           
           // Also, let's handle history and  browser's AddressBar
            var $data     = $(data),
                content   = $data.find('#content').html(),
                pageTitle = $data.find('h1').text();
            window.history.pushState({"html":content, "pageTitle": pageTitle},"", URL );
      });
      
  });
});
</script>
</body>
</html>

你所需要的只是你的页面上的内容：

index.php

<?php include 'header.php'; ?> <!-- header has menu.html -->
<div id="page">
    <div id="content">
         <h1>WELCOME!</h1>
         <p>Article here...</p>
    </div>
</div>
<?php include 'footer.php'; ?>

foo.php

<?php include 'header.php'; ?> <!-- header has menu.html -->
<div id="page">
    <div id="content">
         <h1>FOO!</h1>
         <p>Foo Article here...</p>
    </div>
</div>
<?php include 'footer.php'; ?>

bar.php

<?php include 'header.php'; ?> <!-- header has menu.html -->
<div id="page">
    <div id="content">
         <h1>BAR!</h1>
         <p>Bar Article here...</p>
    </div>
</div>
<?php include 'footer.php'; ?>

_{文档：
http://php.net/manual/en/function.include.php
http://api.jquery.com
http://api.jquery.com/load/
http://api.jquery.com/find/
http://api.jquery.com/html/
https://developer.mozilla.org/en-US/docs/Web/API/window.onpopstate
https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history}

阅读文章需要做的是将页眉和页脚分别放在各自的文件中。

在所有页面上，将页眉和页脚包括在您需要的位置，因此当您打开新页面时，所有页面的页眉和页脚都将相同。

菜单也是如此。将其放在自己的文件中，并将其包含在每一页中。那么它在每个页面上都是一样的，你只需要更新一个文件。

@LazyBrain：那么你只需要摆弄id。例如：

<ul>
<li><a href="#questions">Questions</a></li>
<li><a href="#tags">Tags</a></li>
<li><a href="#answer">Answers</a></li>
</ul>
<div id="questions">
....................
put your content for question page here

</div>

如果您在href中使用目标属性，将其取出，您将在同一窗口中打开链接。

例如

<a href="page.html" target="_blank">Click Here</a> - New window

应该是

<a href="page.html">Click Here</a> - Current window

我相信这就是您想要的，我为您编写了一个html页面，演示如何使用anchor tag将超链接引用（href）设置为同一页面。

试试这个

<html>
  <body>
  <a href="#footer">Go to footer</a>
    <div><a id="header">Your Header</a></div>
    <div style="height:900px;"></div>
    <div><a id="footer">Your Footer</a></div>
    <a href="#header">Go to Header</a>
</body>
</html>

更新

最后我得到了你的问题，你想在所有的页面上使用相同的页脚和页眉。。。正确的

实际上，您正在寻找一个代码，可以使用您已经设计好的PHP文件。所以您只需要使用phpinclude()函数

语法：

在您的标题部分之前

<?php include 'header.php'; ?>

在您的页脚部分之前

<?php include 'footer.php'; ?>

注：

您也可以使用<?php require 'header.php'; ?>

但如果页眉和页脚文件丢失，这可能会产生错误。

当我单击菜单元素时，希望用href在当前页面中打开一个页面

want to open a page in my current page with href when I click on a menu element

搜索引擎友好的AJAX驱动网站：

更新

注：