我有一个生成的 HTML 菜单,如下所示:
<ul class="principal-nav">
<li><a href="#">Item 01</a> <span class="posts-amount">(12)</span></li>
<li><a href="#">Item 02</a> <span class="posts-amount">(7)</span></li>
<li><a href="#">Item 03</a> <span class="posts-amount">(25)</span></li>
</ul>
我需要它看起来像这样:
<ul class="principal-nav">
<li><a href="#">Item 01 <span class="posts-amount">(12)</span></a></li>
<li><a href="#">Item 02 <span class="posts-amount">(7)</span></a></li>
<li><a href="#">Item 03 <span class="posts-amount">(25)</span></a></li>
</ul>
我试图操纵 DOM,但我是一个 jQuery 初学者,到目前为止,我成功地得到了这个结果:
<ul class="principal-nav">
<li><a href="#">Item 01 <span class="posts-amount">(12)</span> <span class="posts-amount">(7)</span> <span class="posts-amount">(25)</span></a></li>
<li><a href="#">Item 02 <span class="posts-amount">(12)</span> <span class="posts-amount">(7)</span> <span class="posts-amount">(25)</span></a></li>
<li><a href="#">Item 03 <span class="posts-amount">(12)</span> <span class="posts-amount">(7)</span> <span class="posts-amount">(25)</span></a></li>
</ul>
这是我的 jQuery 代码:
$('.principal-nav li a').append(
$('span.posts-amount').clone().end()
);
我想我可以使用“每个”来获得一些工作,但由于某种原因,我还不能实现它。我一直在看很多板和教程,但找不到我的问题的任何答案。
谢谢你帮助我!