javascript - Jquery 在 html 和纯文本中查找模式

Question

使用 jQuery 实现这一点的最佳方法是什么

<div class="some-name">
   <strong>8</strong>
   views
   <strong>2</strong>
   likes
</div>

进入

<div class="some-name">
   <div class="wrap">
     <strong>8</strong>
     views
   </div>
   <div class="wrap">
     <strong>2</strong>
     likes
   </div>
</div>

？

我正在尝试包装这个模式

<strong>some text</strong>
some text

在 <div class="wrap"></div>但不确定哪种是对 <strong 进行分组的最佳方式> 和纯文本对。

注意:在使用 Jquery 之前我无法更改 HTML。

Answer 1

您可以过滤 strong 元素，返回它及其同级文本节点。追加后，将相邻文本节点中的文本删除，然后将返回的元素换行:

Example Here

$('.some-name strong').filter(function () {
    $(this).append(this.nextSibling.nodeValue);
    this.nextSibling.nodeValue = '';
    return $(this);
}).wrap('<div class="wrap"></div>');

如果您希望在 strong 元素换行之后附加文本节点:

Updated Example

$('.some-name strong').wrap('<div class="wrap"></div>');
$('.some-name .wrap').each(function () {
    $(this).append(this.nextSibling.nodeValue);
    this.nextSibling.nodeValue = '';
});