Почему HTML5 не включает в себя способ загрузки локального HTML в документ? - PullRequest
29 голосов
/ 29 июля 2011

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

Имеет поддержку почти всех других активов (изображения, видео, аудио).

Да, у нас есть iframes, embeds и objects, но они помещены в песочницу и не следуют потоку остальной части документа.

Я думал о чем-то вроде:

<h2>My wonderful application</h2>

<include src = "leftPane.html" type = "text/html" />

<include src = "main.html" type = "text/html" />

<include src = "footer.html" type = "text/html" />

Я бы хотел, чтобы кто-то объяснил мне это. Почти в каждом веб-приложении, которое мы создаем, мы используем некоторую форму шаблонов для разбиения нашего HTML, так почему же HTML5 не просто включает его?

Буду признателен за ваши (беспламенные) мысли.

Мэтт

Ответы [ 7 ]

20 голосов
/ 30 июля 2011

Как выяснилось, это появилось в списках рассылки WHATWG: На стороне клиента есть предложение : Шеннон предложил именно то, что вы говорите, где парсер должен блокировать при загрузке фрагментов документа.Йен Хиксон отклонил это, потому что стоимость задержки слишком высока.Кроме того, это простая функция, которую уже предоставляют многие веб-серверы, поэтому она была сочтена не стоящей стоимости.

Вместо этого вы можете захотеть исследовать, используя атрибут seamless iframe, что приводит к тому, что весь документ помещается в документ, но действует как любой элемент блока (наследуя стили от основного документа).Хотя я не думаю, что он поддерживается во многих браузерах.

4 голосов
/ 21 октября 2012

Аналогичный вопрос был задан, и это возможно: HTML5 включить файл

Рафа ответ:


Используйте тег object :

<object name="foo" type="text/html" data="foo.inc"/>

foo.inc должен включать действительный HTML.


Я тестировал его на Konqueror, Firefox и Chromium.

Если вы сочтете это полезным (я делаю), пожалуйста, подтвердите ответ Рафа (не мой), потому что «это невозможно» распространяется как болезнь.

4 голосов
/ 23 мая 2012

Нет, каждый запрос не требует обратной передачи на сервер, если содержимое шаблонов является постоянным, то его можно кэшировать и передавать меньше данных. Это причина, по которой вы помещаете css и javascript в отдельные файлы.

3 голосов
/ 12 июня 2012

HTML5 состоит из 3 компонентов: HTML, CSS и JavaScript.Поэтому мы должны использовать их все, чтобы использовать преимущества HTML5.

Внешний HTML-код может быть включен в другой HTML-документ с помощью JavaScript.Единственное, вы должны хранить внешний код в файле .js.Вот пример того, как включить HTML-абзац:

<!DOCTYPE html>
<html>
    <head>
    <title>Main Page</title>
        <script type="text/javascript" src="include_html.js"></script>
    </head>
    <body>
        <script type="text/javascript">
            paragraph();
        </script>
    </body>
</html> 

Содержимое include_html.js

function paragraph()
{
        document.write("<p> This is an HTML paragraph </p>");
}
2 голосов
/ 16 января 2013

Другой способ - использовать jQuery и тег

.

http://irtazaali.wordpress.com/2013/01/16/how-to-include-html-text-from-another-file-into-an-html5-page/

2 голосов
/ 29 июля 2011

Каждый запрос, конечно, потребует двусторонней передачи на сервер. Можете ли вы представить проблемы пропускной способности, которые это может вызвать?Было бы 4 запроса только для вашего фрагмента выше (исходная страница + 3 включает), а затем, конечно, проблемы с отображением в браузере, а затем локальные проблемы с JS (то есть, в какой момент загружается DOM - у вас есть 4 DOM?).

0 голосов
/ 14 августа 2014

Это еще не совсем официально, но похоже, что в ближайшем будущем к спецификации HTML могут быть добавлены новые веб-компоненты, новая концепция, которая позволит импортировать аналогично тому, как вы описали. Он не ведет себя точно так, как вы просили - как отметил Барри Кей, это может создать какую-то проблему - но вместо этого он берет эту идею и решает проблемы.

Текущий рабочий черновой вариант концепции можно посмотреть здесь: http://w3c.github.io/webcomponents/spec/imports/

И я также нашел эту статью, которая может быть легче понять (это было для меня) здесь: http://www.html5rocks.com/en/tutorials/webcomponents/imports/

Я знаю, что это в основном теоретический ответ, но тогда это был также своего рода теоретический вопрос;).

...