如何使用jQuery在文本节点周围包装HTML？

Question

<div class="pagination">
  <a href="#">1</a>
  <a href="#">2</a>
  3
  <a href="#">4</a>
</div>

我需要使用jQuery围绕数字"3"包装HTML元素.我无法修改HTML,因为它是动态生成的.

Answer 1

我有一个类似的问题,包裹所有流浪文本

$(function() {

    var test = $('.pagination')
        .contents()
        .filter(function() {
            return this.nodeType === 3 && $.trim(this.nodeValue) !== '';
        })
        .wrap('<span/>');

});?

刚刚与未成年人的困惑wrap()和wrapAll().这是一个演示

Answer 2

这将使用span包装所有数字,因此结构将是:

<a><span>1</span></a>

并且所选择的只有跨度而没有:

<span>2</span>


var html = $('.pagination').html();
    html = html.replace(/[0-9]/g,"<span>$&</span>");
    $('.pagination').html(html);

所以你可以轻松地设计它:

.pagination a span {normal style} 
.pagination span{selected style}