jquery - 使用 jQuery 在元素之后和之前添加标签

Question

假设我有这个标记：

<li class="cat-item"><a href="#">Item 1</a> 5 </li>
<li class="cat-item"><a href="#">Item 2</a> 9 </li>
<li class="cat-item"><a href="#">Item 3</a> 4 </li>
<li class="cat-item"><a href="#">Item 4</a> 3 </li>
<li class="cat-item"><a href="#">Item 5</a> 7 </li>

<li><a>item</a>我想在之后和之前插入一个跨度标签</li>。

<li class="cat-item"><a href="#">Item 1</a><span> 5 </span></li>
<li class="cat-item"><a href="#">Item 2</a><span> 9 </span></li>
<li class="cat-item"><a href="#">Item 3</a><span> 4 </span></li>
<li class="cat-item"><a href="#">Item 4</a><span> 3 </span></li>
<li class="cat-item"><a href="#">Item 5</a><span> 7 </span></li>

我想做jQuery。有谁知道怎么做？

Answer 1

尝试

$('li.cat-item a').each(function(){
    $(this.nextSibling).wrap('<span>');
});

这会将文本节点（即它的nextSibling ）之后包装在一个<a><span>

演示

Answer 2

span这将在每个a标签之后插入一个空标签li.cat-item：

$('li.cat-item a').after('<span />');

见jQuery - after()