将<div>的内容作为单独的HTML文件下载

Question

我目前正在构建一个拖放模板构建器,允许用户选择预先填充的内容并在浏览器窗口内对其进行排序.然后我希望用户能够将新填充的单独HTML/Zip文件.

它类似于MailChimp模板构建器中使用的功能.

但是,我正在推动我的技能组合的界限,我正在寻求帮助,以便用户可以下载新填充的内容.我在这里学习所以任何建议都不仅仅是值得赞赏的.

有人有什么想法吗？

谢谢!

Answer 1

您可以将锚点与"data:"架构一起使用,例如使用类似的内容

<div id="content">
    <h1>Hello world</h1>
    <i>Hi everybody</i>
</div>

你可以使用脚本:

var a = document.body.appendChild(
        document.createElement("a")
    );
a.download = "export.html";
a.href = "data:text/html," + document.getElementById("content").innerHTML;
a.innerHTML = "[Export conent]";

将DIV内容导出到文件中:http://jsfiddle.net/BHeMz/