将内容附加到所需位置的现有 div答案

【问题标题】：Appending contents to already existing div at required position将内容附加到所需位置的现有 div
【发布时间】：2012-01-12 23:07:35
【问题描述】：

我希望在已经存在的 div 之间添加新的 div，如示例所示。

<div id='container1'>Some contents</div>
<div id='container2'>Some contents</div>
<div id='container3'>Some contents</div>
<div id='container4'>Some contents</div>
<div id='container5'>Some contents</div>

现在假设我希望使用 AJAX 在容器 4 之后但容器 5 之前附加一些内容。

如何，这可以使用 Javascript 来完成吗？

【问题讨论】：

推荐人stackoverflow.com/questions/4023194/…

标签： javascript dom append

【解决方案1】：

我正在向您展示使用 Jquery，您可能会有一个想法：

jQuery('<div/>', {
    id: 'container6'
}).appendTo('#container4');

或者

$("#container5").before("<div></div>");

【讨论】：

【解决方案2】：

使用 jquery .after() Here documentation

【讨论】：

【解决方案3】：

您可以使用 jQuery 轻松做到这一点：

$("#container4").after("text to append");

【讨论】：

【解决方案4】：

.append 在 Jquery 中将由参数指定的内容插入到匹配元素集中每个元素的末尾。

$("#container4").append("<div>Something</div>");

或者使用.before。它会将新的 div 添加到现有的 div 之前。

$("#container5").prepend("<div>Something</div>");

看到这个demo。

【讨论】：