javascript - 使用 JQuery 换行内容，包括文本

Question

我的内容看起来像这样:

<div id='container'>
.
.
.
 <div id='fromHere'>...</div>
  foo<br />
  bar<br />
  <div class='etc">
   ...
  </div>
</div>

我需要将 #container 的内容，在 #fromHere 之后包装在 div 中，如下所示:

<div id='container'>
.
.
.
 <div id='fromHere'>...</div>
  <div id='newDiv'>
   foo<br />
   bar<br />
   <div class='etc">
    ...
   </div>
 </div>
</div>

我想我可以通过像6962614这样的字符串操作来做到这一点但这必须是可重用的，因此如果可能的话我更愿意使用 JQuery 选择器。

Answer 1

您可以使用 .contents() 的组合, .slice() , .index()和 .wrapAll() :

var $elements = $("#container").contents();
$elements
  .slice($elements.index($('#fromHere')) + 1)
  .wrapAll('<div id="newDiv"></div>');

DEMO

这会获取#container的所有子节点，确定#fromHere在其兄弟节点中的索引，获取所有后续兄弟节点并将它们包装在一个新元素中。