我正在构建一个人们可以发送电子邮件的平台 - 显示电子邮件的预览,我在表单下方使用div来输入邮件.
所以一般结构如下:
<html>
<body>
<form>
<!-- Form to enter email here -->
</form>
<div>
<!-- Email preview here -->
<html>
<!-- Email content, updated everytime user types something --->
</html>
</div>
</bod>
</html>
Run Code Online (Sandbox Code Playgroud)
但是,简单地使用html文档中的html标签本身似乎会混淆每个浏览器 - 而且,它看起来并不是很干净.
由于发送的电子邮件将是一个完整的html文档,因此最简单的方法是将所有内容放在div中.
我怎样才能以有效,干净的方式做到这一点?
使用 iframe。您可以向它们写入动态内容 - 您不必总是使用src属性将物理页面加载到它们中。
HTML:
<iframe name='preview'></iframe>
Run Code Online (Sandbox Code Playgroud)
JS(在 DOM 就绪回调中)
var doc = document.preview.open("text/html","replace");
doc.write('<html><body><p>this is some content</p></body></html>');
doc.close();
Run Code Online (Sandbox Code Playgroud)