Question

我想在我可以在另一个html文档中编写html文档的地方设置一些东西，然后在内嵌渲染嵌套的html文档。我知道常见的争论是这不是要做的事情，但我有两个理由想要这样做：

我想减少我管理的物理文件的数量，因此iframe或渲染部分并不完全是我所追求的，因为它们需要一个实际的单独文档来呈现。
我希望能够展示一些html的示例，然后加载一个html文档，在不使用图像的情况下在同一页面上显示浏览器中的内容。

我知道这是可能的，因为几个在线html编辑器允许你编写html，然后生成html到一边，我想这可能只是部分动态重写部分文件，但是当然不是所有人都这样做，所以有没有办法除了使用iframe或partials来实现这一目标？我正在使用带有C＃的asp.net mvc。

Answer 1

在线编辑器通过在编辑器中将HTML代码作为子元素注入到另一个应该充当预览容器的容器中来呈现HTML。

除了存储HTML片段之外没有服务器端活动（如果预加载，则存储在数据库中的部分内容）。

它可以作为纯粹的客户端活动来完成。当然，您必须编写一个自定义渲染器来解析用户传递的代码的内容，去掉HTML标签，在head标签上加载脚本和其他引用，在head标签中设置标题，并将body标签的内容附加到演示div中。

但是这很麻烦。最好将HTML存储在DB / app缓存中并通过iframe呈现它，这样您就不必处理大量的部分内容。只是CRUD。 / ================================================= ====================== 更新：对澄清的回应

是的，有可能。嵌入你的＆＃34; inner-html＆＃34;作为一个＆＃39; javascript模板字符串变量＆＃39;在你的＆＃34; main-html＆＃34;文献。有点像这样：

  <script type="text/javascript">  // <![CDATA[
           var innerhtml1 = `
                            <div> 
                              <p>This markup is part of innerhtml1</p>
                            </div>
                           `;
           // ]]>
    </script>

（我不确定你是否真的需要CDATA部分，如果你想使用模板文字的话。）

然后你可以执行

$("#container1").html(innerhtml1);

on＆＃34; main-html＆＃34;文档和确保您没有HTML和正文标记。但是你想要展示的内容（如上所述）就足够了。

如果你真的有HTML和body标签。你应该找到一种方法来挖出源字符串的body标签的内容并将其插入预览容器。这应该很容易通过正则表达式传递字符串和标签之间的东西。但我很确定你可能不需要这个。

通过这种方式，您可以在一个html页面中虚拟存储吨（开玩笑）的HTML文档。

Codepen链接在这里： http://codepen.io/anon/pen/dOJMwo?editors=1010#0

请注意，这仅适用于支持模板文字内容的浏览器。（目前非常好。请参见此处：EcmaScript6 template strings support）否则你仍然可以使用标准字符串，但是你必须使用转义和其他处理来正确格式化它。然后才能直接注入它。

嵌套html文档内联

1 个答案: