HTML 换行方法

HTML wrap approach

本文关键字:方法 换行 HTML      更新时间:2023-09-26

我正在构建一个允许用户创建HTML页面的应用程序。当用户下载他们的页面时,我会获取画布div 中的所有 HTML 并将其保存为 HTML 文件,其中包含他们的页面元素。

现在的问题是我需要找到一种方法在他们下载之前用这样的方式包装页面。

下载前

<div id="page-area">
   // PAGE ELEMENTS
</div>

下载后的结果

<html>
<head>
  <title>page</title>
  <head>
    <body>
      // PAGE ELEMENTS
    </body>
</html>

用 HTML、

头部、正文和其他基本 HTML 结构标签包装多个元素的最佳方法是什么?寻找jQuery解决方案或原始JavaScript。

例如,如果我能把所有这些元素都拿来

<ul>
  <li>List</li>
</ul>
<div id="tabs">
  <span>test</span>
  </tabs>

然后用这样的基本 HTML 结构进行包装

<html>
<head>
</head>
<body>
  <ul>
    <li>List</li>
  </ul>
  <div id="tabs">
    <span>test</span>
    </tabs>
</body>
</html>

我将如何使用jQuery做到这一点?

这是一个用于代码参考的工作 jsFiddle。

.HTML:

<div id="content">
    <h1>Hello</h1>
    ...
</div>

.JS:

var a = document.body.appendChild(document.createElement("a"));    
a.download = "export.html";
html = "<html><head></head><body>" 
html += document.getElementById("content").innerHTML;
html += "</body></html>" 
a.href = "data:text/html," + html;
a.innerHTML = "[Download HTML]";