Question

我正在努力解决这个问题。

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

以下是情景：

<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之后获取下一个textnode并包装：

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

FIDDLE

由于jQuery确实没有获得文本节点，因此本机nextSibling应该可以正常工作。

Answer 2

为此你可以在$（'。ContentDiv'）之后添加一个div，然后将html添加到它。

$("<div id='new_div'></div").insertAfter($('.ContentDiv')).html("Share your knowledge. <a href='URL'>Be the first to write a review »</a>");

围绕特定文本换行新的div元素

2 个答案: