在 jQuery 中将 HTML 附加到 HTML 字符串

Append HTML to HTML string in jQuery

本文关键字：HTML 字符串 中将 jQuery      更新时间：2023-09-26

我有一个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>标签，我需要保留在它们的位置。 当我将字符串转换为 $（字符串） 时，我无法将其恢复为原始形式： 

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

你可以

这样做：

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

嗨@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);

祝你好运！！！

相关文章：