将 HTML 附加到 jQuery 中的 HTML 字符串答案

【问题标题】：Append HTML to HTML string in jQuery将 HTML 附加到 jQuery 中的 HTML 字符串
【发布时间】：2016-03-09 16:17:49
【问题描述】：

我有一个 HTML 字符串，我想在任意位置附加另一个 html 字符串。

例子：

var htmlString = '<div id="insert"> <p> Hello </p> </div>'

var appendString = '<p> Goodbye </p>'

$(appendString).appendTo( $(htmlString).find('#insert') )

显然这不起作用，因为它不能直接插入到字符串中但是，我不想将 htmlString 转换为 jQuery 对象，因为它会弄乱 HTML 文档的结构，我需要将脚本标签保留在它们被插入的位置。

希望这已经足够清楚了。

编辑：

抱歉，我认为我对问题的解释很糟糕。

我有一个包含表格的 HTML 字符串，我想在表格中添加一个新行。我的问题是我有许多<script> 标签需要保留在它们的位置。当我将字符串转换为 $(string) 时，我无法将其恢复为原始形式：

var htmlString = $('body').html();
var $htmlString = $(x);
console.log($htmlString.html());

这是我尝试在其上执行此操作的 Confluence 页面，并且我对源代码的访问权限有限；我能做的就是修改已经存在的内容。

HTML 字符串来自 Confluence 上另一个页面的 AJAX 请求，我需要将脚本保留在同一位置，以便我的其他宏能够正确运行。

我已经包含了我的问题的 JS Bin 示例，希望能清楚地说明我的问题。

https://jsbin.com/ruwawuzica/edit?html,js,output

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

你可以这样做：

var htmlString = '<div id="insert"> <p> Hello </p> </div>';

var appendString = '<p> Goodbye </p>';
var added = ($(htmlString).append($(appendString)));
$(added).appendTo('div');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>

因为$(htmlString) 是element <div id="insert"></div> 包裹在jquery 中

【讨论】：

真正有问题的问题是我们如何在 HTML 的 id="insert" 部分中插入一个字符串，但您建议我们如何附加 html。

【解决方案2】：

嗨@MyLittleDax 我想你可以这样做：

var htmlString = "<div id='insert'> <p> Hello </p> </div>";
var appendString = "<p> Goodbye </p>";
//your container where you put the html
var container = $('#container'); 
container.empty();
container.append(htmlString);
var insert = $('#insert');
insert.append(appendString);

祝你好运！！！

【讨论】：