jQuery的 - 移動列表項的元素相同項目的另一個元素中+這樣做的

我有一個生成的HTML菜單，看起來像這樣我的列表中的每一項：jQuery的 - 移動列表項的元素相同項目的另一個元素中+這樣做的

<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() 
);

我想我能得到的東西用「每一個」，但由於某些原因，我無法實現這一目標還沒有工作。我一直在看很多板和教程，但找不到我的問題的任何答案。

謝謝你幫助我！

來源

2012-09-11 frontenddeveloper.0fees.net

這是一個概念錯誤。在你需要用jQuery修復一個設計問題的時候，你一定可以修復它。爲什麼不能正確生成HTML。如果您在設計時進行了修復，則以後不需要使用jQuery。 –

我完全同意你的看法。問題是我堅持使用舊版本的Wordpress。我不想編輯我的主題目錄之外的文件。我試圖創建一個新的菜單（有一個很好的功能），但它使我的博客崩潰。我現在沒有時間重新開始這個博客，因爲它只是一個側面項目。這就是爲什麼我採用jQuery的方式。但是，再次，你是完全正確的：有一個更好，更乾淨的方式來做到這一點;） –

有時候最好的方式不是更有效率，並不是最快的。我理解你。 –

演示：http://jsfiddle.net/RJzq7/

$('.principal-nav li a').each(function() { 
    $(this).next().appendTo(this); 
});

來源

2012-09-11 08:06:48

我已經接受你的回答，但董事會要求等待6分鐘才能確認。我的代碼都很好。完全符合我的需求。非常感謝你！ –

克隆將創建元素的副本。因此請使用appendTo（）。

來源

2012-09-11 08:30:08 mohanrajt

jQuery的 - 移動列表項的元素相同項目的另一個元素中+這樣做的

回答

相關問題