2017-02-22 8 views
2

Я хочу, чтобы показать HTML электронной почты в моем HTML страницывключают HTML электронной почты в HTML файл

То есть мой упрощенный index.html

<!DOCTYPE html> 
<html class="no-js" lang=""> 
<head></head> 
<body> 
    <div id='email_goes_here'></div> 
</body> 
</html> 

И что начало моей email.html

<!doctype html> 
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"> 
    <head> 
     .... 

Я хочу поместить код от email.html внутри div#email_goes_here от index.html.

Действительно ли для копирования и вставки кода в div? Я не уверен, имеет ли его действительный html 2 <!DOCTYPE html> и 2 <html> тегов. Если он недействителен, как я могу отобразить html-страницу внутри другой страницы html? Любой подход с использованием PHP или jQuery будет в порядке.

Я искал эту проблему, но я ничего не нашел. Я только нашел вопрос, как включить некоторый html-контент в файл anoter html, но не как включить полную html-страницу. Вот ссылки, которые я нашел:

Include another HTML file in a HTML file

view html page inside another html

How do I load an HTML page in a <div> using JavaScript?

How to include an HTML page into another HTML page without frame/iframe?

+0

'Я не уверен, если его действительная HTML не иметь 2 И 2 tags' Нет это не так, вам нужно включать только один из каждых. Чтобы решить эту проблему, используйте Server Side Includes. Это очень просто в PHP. –

ответ

1

Ваш простой подход будет использовать .

Если вы используете атрибут srcdoc, вам не придется настраивать любые внешние html-документы.

Рабочий пример:

<iframe srcdoc=" 
 
<html> 
 
<head> 
 
<style>p{color: rgb(255,0,0);}</style> 
 
</head> 
 

 
<body> 
 
<p>This is an example of an <code>iframe</code> which uses the <code>srcdoc</code> attribute.</p> 
 
</body> 
 
</html> 
 
"> 
 
</iframe>


Дополнительная литература:https://developer.mozilla.org/en/docs/Web/HTML/Element/iframe

+1

iframe не поддерживаются в мобильных браузерах, предположите, что это должно быть указано. –

+2

Использование iframe также увеличивает количество HTTP-запросов на сервер. Что-то определенно стоит рассмотреть, если у вас есть большой объем сайта или медленный сервер –

+0

@MichaelDiPrisco - iframe в приведенном выше примере _is_ работает в моем мобильном браузере. (Firefox для Android). – Rounin

0

Вы можете попробовать использовать IFRAME: https://developer.mozilla.org/fr/docs/Web/HTML/Element/iframe Это позволяет иметь одну страницу внутри другой, но имеет некоторые ограничения.

+2

iframe не поддерживаются в мобильных браузерах, предположим, что это должно быть указано. –

1

Краткий ответ: используйте PHP.

Существует множество способов включить ваши страницы в другие. Скопировать-вставить не будет хорошо, как вы, как вы догадались, две html-объявления не могут быть на одной странице.

Вы можете использовать , но, глядя, как браузеры начинают их отбрасывать, более жизнеспособным способом является использование PHP include или require. Конечно, даже с помощью этого метода две объявления html не разрешены, поэтому вам придется «очистить» ваш файл email.html.

EDIT: Не забудьте указать, что iframe не разрешено в мобильных браузерах, поэтому вы потеряете их, если используете iframes.

0

Другим способом, чтобы сделать это более правильно, было бы использование некоторых фреймворков javascript, которые сделаны для использования повторно используемых компонентов (например, Angular.js или React.js). И используйте свою страницу электронной почты как компонент. Это будет длиннее.

0

Вы можете использовать HTML-тег для вставки другого документа в текущий HTML-документ.

Подробнее: https://www.w3schools.com/TAGs/tag_iframe.asp

+0

iframe не поддерживаются в мобильных браузерах, предположим, это должно быть указано. –