Разделить html-страницу и загрузить ее через заголовок?

Я использую HTML5 и хотел бы ускорить создание и редактирование моего стандартного HTML-шаблона, разделив его на три отдельных HTML-файла.

  • header.html
  • content.html (он будет отредактирован и будет иметь другие имена, например, home)
  • footer.html

Я просмотрел следующие ресурсы, но не уверен, возможно ли это и как это сделать.

http://www.w3schools.com/html/html_head.asp

http://www.w3schools.com/tags/tag_link.asp

В PHP я бы просто включил файлы в правильном порядке. Есть ли эквивалент в простом HTML-сайте?

Я погуглил, но не думаю, что ищу нужный термин. Буду признателен за любую доступную информацию или ресурсы!

Спасибо за ваше время!


person tomaytotomato    schedule 16.12.2011    source источник
comment
Совершенно вне контекста, но тем не менее интересно: w3fools.com   -  person nfechner    schedule 16.12.2011
comment
Кроме того, чтобы вы знали, ни одна из двух вещей, на которые вы смотрели, вам не поможет.   -  person cdeszaq    schedule 16.12.2011
comment
@nfechner, ты навсегда избавил меня от этого сайта! Спасибо за то, что разбудили :), надеюсь, я не усвоил никаких вредных привычек с этого сайта!   -  person tomaytotomato    schedule 16.12.2011


Ответы (7)


Для статического HTML-сайта не существует способа только html для включения файлов так, как вы пытаетесь. Вы можете иметь возможность использовать серверные включения в зависимости от вашего сервера, но к этому моменту вы можете просто использовать PHP.

Другой вариант - широко использовать Javascript для загрузки частей страницы после того, как основная часть страницы уже загружена.

Однако во всех случаях производительность будет значительно снижена, поскольку запрос сервера выполняется медленно. Если вам нужно использовать шаблоны, просто используйте динамический язык, например PHP.

person cdeszaq    schedule 16.12.2011
comment
Спасибо за четкий и лаконичный ответ, сейчас я возвращаюсь к PHP :) - person tomaytotomato; 16.12.2011

Вы не можете сделать это чисто с помощью HTML. Вы можете использовать iFrames, но это далеко не так. Оптимальным решением будет использование PHP. Это также сохранит вам запросы из браузера.

person Madara's Ghost    schedule 16.12.2011
comment
ну что ж, вернемся к PHP, я думаю, просто пытался сделать простой веб-сайт :) - person tomaytotomato; 16.12.2011
comment
@loosebruce - В общем, для любого сайта с большим количеством страниц сегодня вам в основном нужен какой-то серверный язык. - person cdeszaq; 16.12.2011

Вы можете сделать это с помощью включаемых файлов в SHTML или с помощью некоторой серверной обработки, которая может объединить файлы в один выходной поток HTML, когда пользователь запрашивает URL-адрес. Стандартный HTML-код не обрабатывается на сервере, поэтому вам необходимо использовать некоторые серверные технологии, такие как .NET, ASP, PHP, CGI и т. Д.

person Dave Mroz    schedule 16.12.2011

Невозможно сделать это с помощью обычного HTML. Вы можете сделать это с помощью JavaScript, чтобы загрузить разные страницы на свои места после загрузки главной страницы. Но это кажется несколько странным и ненужным.

person nfechner    schedule 16.12.2011

Самый простой способ, которым я знаю, как это сделать, - использовать какую-то структуру стиля Model-View-Controller (MVC). Я бы использовал CodeIgniter, созданный на PHP. Он легкий (2.1 ОЧЕНЬ быстрый), имеет отличную документацию, очень прост для понимания (даже если вы мало разбираетесь в PHP), создает чистые URI и позволяет создавать динамические веб-сайты (а это то, что вы желая сделать) с большой легкостью. Ваши отдельные страницы (называемые «представлениями» в терминологии MVC) смогут загружаться в выбранном вами порядке; в любом количестве методов контроллера. Это невероятно!

Ниже приведены некоторые ресурсы, которые помогут объяснить, о чем я говорю:

Руководство пользователя CodeIgniter - Модель-представление-контроллер:

http://codeigniter.com/user_guide/overview/mvc.html

Руководство пользователя CodeIgniter - Просмотры

http://codeigniter.com/user_guide/general/views.html

Вот несколько ресурсов, которые помогут вам начать работу с CodeIgniter:

Руководство пользователя CodeIgniter:

http://www.codeigniter.com/user_guide

CodeIgniter From Scratch Series от Nettuts +:

http://net.tutsplus.com/sessions/codeigniter-from-scratch/

Вот некоторые ресурсы, которые могут вам понадобиться, если вам нужно больше узнать о PHP для начала:

http://www.php.net

http://net.tutsplus.com/tutorials/php/the-best-way-to-learn-php/

Я надеюсь, что это поможет, и дайте мне знать, если вам понадобится дополнительная помощь или более четкое объяснение. Удачи!

person imlouisrussell    schedule 16.12.2011
comment
Спасибо, я хорошо знаком с фреймворком codeigniter и его системой представлений. Замечательно иметь представление шаблона и просто передавать контент через taht - person tomaytotomato; 16.12.2011

Вопрос в том, какого результата вы ожидаете? Ваш вопрос выглядит так, будто у вас нет опыта, но вы чувствуете, что с вашей архитектурой что-то не так. Вам это нужно для большой веб-страницы или для чего-то меньшего? Попробуйте найти любую CMS, и у нее будет решение, которое сделает вашу работу более понятной :) Если вы хотите поэкспериментировать, начните с самого начала. У вас может быть один макет и несколько файлов содержимого. Если ваш сайт простой, попробуйте

<body><div>header</div><div><?php include('content'.addslashes($_GET['id']).'.php') ?></div>
<div>footer</div></body> 

Не используйте iframe, это устаревшее решение :)

person Community    schedule 16.12.2011
comment
Если у вас нет знаний о php и вы хотите получить хорошую практику, прочтите о mvc и hmvc как о другом фреймворке. Codeigniter - плохая идея, если у вас нет опыта, zend framework тоже. Прочтите о Symfony 2.0. У вас много статей, очень хорошая документация, видео-презентации. Постарайтесь понять, как это работает, и в качестве следующего шага используйте его для своего веб-сайта. Я рекомендую канал поддержки irc #symfony. Вы можете подключиться к irc через клиент mirc для windows (сервер sendak.freenode.net или другой) :) Удачи! - person ; 16.12.2011

В HTML5 вы можете встраивать (но не включать) HTML-документы с помощью _ 1_ element с _ 2_ element, и с _ 3_ element.

<object data="include-me.html" type="text/html"><!-- fallback content --></object>

<iframe seamless src="include-me.html"></iframe>

<embed src="include-me.html" type="text/html"></embed>

embed

Использование embed может быть немного ненадежным, не в последнюю очередь потому, что оно предназначено «для внешнего (обычно не HTML) приложения или интерактивного контента». Если HTML-документ не отображается, попробуйте удалить атрибут type (по крайней мере, тогда он работал в Chromium).

iframe

Использование iframe может работать для вас в сочетании с атрибутом seamless (остерегайтесь поддержки браузера). В спецификации HTML5 (CR) есть пример:

Включение HTML осуществляется с помощью этого атрибута, как в следующем примере. В этом случае добавлена ​​панель навигации по всему сайту.

<!DOCTYPE HTML>
<title>Mirror Mirror — MovieInfo™</title>
<header>
 <h1>Mirror Mirror</h1>
 <p>Part of the MovieInfo™ Database</p>
 <nav>
  <iframe seamless src="nav.inc"></iframe>
 </nav>
</header>
...

object

В спецификации HTML5 (CR) есть пример:

В этом примере HTML-страница встроена в другую с помощью элемента object.

<figure>
 <object data="clock.html"></object>
 <figcaption>My HTML Clock</figcaption>
</figure>
person unor    schedule 22.12.2013