Веб-сайт, включая страницы / страницы моего сайта

Question

У меня есть свой сайт на index.html, созданный в формате html + css. На моем index.html у меня есть этот div-идентификатор "content", в который вы помещаете основной контент на страницу, а в строке меню есть ссылка, которая источник в page2.php. Когда вы нажимаете на ссылку, она переходит на страницу page2.php, но я хочу, чтобы она отображалась внутри

Я не хочу использовать фреймы. Должен ли я разделить свой дизайн на index.php, а затем на page2.php включить top & footer? или есть другой способ

function test() {
var xhr = XMLHttpRequest();
xhr.onreadystatechange = function(){
   if(xhr.readystate==4 && xhr.status=200)
      document.getElementById('content').innerHTML = xhr.responseText;
};

xhr.open("GET", "start.php", false);
xhr.send(null);
}

<a href="start.php" onclick="test(); return false;">Hjem </a> | 

<div id="content" ></div>

Answer 1

Используйте AJAX, чтобы отправить HTTP-запрос GET на page2.php и отобразить результат (echo) в контейнере div.

Примерно так (не будет работать в IE)

<script>
function test(){
   var xhr = XMLHttpRequest();
   xhr.onreadystatechange = function(){
      if(xhr.readystate==4 && xhr.status=200)
         document.getElementById('content').innerHTML = xhr.responseText;
   };

   xhr.open("GET", "page2.php", false);
   xhr.send(null);
}

</script>

Попробуйте AJAX онлайн

Answer 2

Как вы и предложили в своем вопросе, вы должны разбить index.html на верхний и нижний колонтитулы. Это позволит вашему сайту работать без JavaScript, и вы можете обнаружить, что это проще или имеет больше смысла.

Есть несколько хороших учебников, таких как , этот , но поиск в заголовке php header footer возвращает множество вариантов.

Answer 3

Вы можете использовать XMLHttpRequest() и не только "Hello this is a test", но вы также можете установить любые данные из базы данных MySQL на <div id="content"> innerHTML.