2017-02-22 7 views
2

ich eine HTML-E-Mail in meinem HTML-Seitehtml E-Mail in HTML-Datei enthalten

Das ist zeigen will, ist mein vereinfachte index.html

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

Und das ist der Anfang meines 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> 
     .... 

Ich möchte den Code von email.html innerhalb der div#email_goes_here von index.html setzen.

Ist es gültig, nur den Code im div zu kopieren und einzufügen? Ich bin nicht sicher, ob sein gültiges HTML 2 <!DOCTYPE html> und 2 <html> Tags hat. Wenn es nicht gültig ist, wie könnte ich die HTML-Seite in einer anderen HTML-Seite anzeigen? Jeder Ansatz mit PHP oder jQuery wäre in Ordnung.

Ich war auf der Suche nach diesem Problem, aber ich habe nichts gefunden. Ich habe nur die Frage gefunden, wie man einen HTML-Inhalt in eine anter-HTML-Datei einfügt, aber nicht, wie man eine komplette HTML-Seite einbindet. Hier sind die Links, die ich gefunden:

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

'Ich bin nicht sicher, ob seine gültige html 2 haben Und 2 tags' Nein, es ist nicht, müssen Sie nur eine von jeweils. Um dieses Problem zu lösen, verwenden Sie Server Side Includes. Dies ist in PHP sehr einfach. –

Antwort

1

Ihre einfachste Ansatz wird zu verwenden.

Wenn Sie das Attribut srcdoc verwenden, müssen Sie keine externen HTML-Dokumente einrichten. Beispiel

Arbeits:

<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>


Weiterführende Literatur:https://developer.mozilla.org/en/docs/Web/HTML/Element/iframe

+1

iFrames werden nicht in mobilen Browsern unterstützt, raten Sie darauf hingewiesen werden. –

+2

Die Verwendung eines iframe erhöht auch die Anzahl der HTTP-Anforderungen an den Server. Etwas, das auf jeden Fall eine Überlegung wert ist, wenn Sie eine große Website oder langsamen Server haben –

+0

@MichaelDiPrisco - der iframe im obigen Beispiel _ist_ funktioniert in meinem mobilen Browser. (Firefox für Android). – Rounin

0

Sie können versuchen, iframe zu verwenden: https://developer.mozilla.org/fr/docs/Web/HTML/Element/iframe Es erlaubt, eine Seite innerhalb einer anderen Seite zu haben, hat aber einige Einschränkungen.

+2

iFrames werden nicht in mobilen Browsern unterstützt, denke, es sollte darauf hingewiesen werden. –

1

Kurze Antwort: Verwenden Sie PHP.

Es gibt viele Möglichkeiten, Ihre Seiten in andere zu integrieren. Copy-Paste ist keine gute Sache, denn Sie haben es erraten, dass zwei HTML-Deklarationen nicht auf derselben Seite sein können.

Sie könnten ein verwenden, aber schauen, wie Browser die, ein gangbarer Weg PHP verwendet include oder require zu fallen beginnen. Natürlich sind selbst bei dieser Methode zwei HTML-Deklarationen nicht erlaubt, daher müssen Sie Ihre email.html-Datei "säubern".

BEARBEITEN: Vergessen Sie, dass iframes in mobilen Browsern nicht erlaubt sind, also werden Sie diese verlieren, wenn Sie iframes verwenden.

0

Eine andere Möglichkeit, dies richtiger zu tun, wäre die Verwendung eines Javascript-Frameworks, das wiederverwendbare Komponenten (wie Angular.js oder React.js) erstellt. Und verwenden Sie Ihre E-Mail-Seite als Komponente. Es wird jedoch länger zu lernen sein.

0

Sie können ein HTML-Tag verwenden, um ein anderes Dokument in das aktuelle HTML-Dokument einzubetten.

Lesen Sie mehr: https://www.w3schools.com/TAGs/tag_iframe.asp

+0

iFrames werden nicht unterstützt In mobilen Browsern sollte man darauf hinweisen. –