javascript - 在特定文本周围包裹一个新的 div 元素

Question

我正在纠结这个问题。

如何包装一个新的 <div>没有任何类或 ID 的文本周围的元素？

场景如下:

<div class="ContentDiv">.....</div>

Share your knowledge. <a href="URL">Be the first to write a review »</a>

我需要新的 div环绕“Share your knowledge. <a href="URL">Be the first to write a review »</a>”

我尝试了以下方法:

$(document).ready(function() {
  $('.ContentDiv').each(function() {
    $(this).add($(this).next()).wrapAll('<div class="NewDiv"></div>');
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="ContentDiv">.....</div>

Share your knowledge. <a href="URL">Be the first to write a review »</a>

但它不起作用，因为它环绕了 <a>仅元素并在其下方保留文本。我还需要其中的其余文本。

Answer 1

您需要在 .ContentDiv 之后获取下一个文本节点并将其包装:

$('.ContentDiv').each(function() {
   $(this).next('a').add(this.nextSibling).wrapAll('<div class="NewDiv"></div>');
});

FIDDLE

由于 jQuery 并不真正获取文本节点，因此原生 nextSibling 应该可以工作。