如何在 JS 文件中添加 HTML 代码？答案

【问题标题】：How to add HTML code inside a JS file?如何在 JS 文件中添加 HTML 代码？
【发布时间】：2016-11-17 09:41:09
【问题描述】：

我需要包含一个在 JavaScript 函数中添加预览窗格的 HTML，如下所示：

<html>
<body>
    <div style="height: 70%; border: 1px solid #000; overflow: auto;">
        <div style="background: #ddd; height: 1000px;">master</div>
    </div>
    <div style="height: 30%; border: 1px solid; #000; overflow: auto;">
        <div style="background: #ddd; height: 1000px;">detail</div>
    </div>
</body>
</html>

【问题讨论】：

问题是......
获取 HTML 字符串并将该源提供给预览窗格。

标签： javascript jquery html

【解决方案1】：

你可以：

使用一些模板引擎，例如：
- 小胡子https://github.com/janl/mustache.js/
- 角https://angularjs.org/
将代码作为文本写入 var 中，然后将其附加到它们的 dom 中。（见document.write()）

【讨论】：

【解决方案2】：

只需在 html 周围使用引号，例如

var a = 'some string';

只是你必须在 1 行中包含所有 hmtl 或逐行添加到 var。

或者使用 ES5 并像这样制作：

let a = `any
string
with new lines`;

或者

将 jsx 与 ReactJs 一起用于 js 中的 html！太棒了:-) 上次我在 js 之外写 html 就像 2 年前一样。 https://facebook.github.io/react/

开始学习的好地方：

https://www.youtube.com/playlist?list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr

【讨论】：

【解决方案3】：

我不确定这是否是您要问的... 您想通过 JavaScript 动态添加 HTML 吗？这是使用 jQuery 的一种方法：

var html = '<div id="whatever"></div>';
$("body").prepend(html);

【讨论】：

【解决方案4】：

如果你想在 javascript 中编写 html 标记，你可以转向 React JS，这是一个非常强大的完整引擎，用于在 javascript 中编写 html 标记，它提供了很多其他的东西。

【讨论】：