遍歷每個h2並將它們的值附加到另一個div集合

Question

我有一個問題。

我將如何迭代他們的div中的每個h2，獲取他們的文本值並將它們附加到另一組div中，以便它們出現在另一邊？

我可以使用eq或其他東西，並通過每一個，但這是不理想的，因爲在任何給定時間div的數量可能會更多或更少，我只需要回去調整js來調整爲div的數量。

在這個例子中，我沒有完成js，因爲我不知道如何處理這個問題。

任何幫助表示讚賞。

Fiddle Example

感謝

Answer 1

我認爲使用.eq是你唯一的選擇，但它不會讓你的代碼不靈活：

var $divs = $('.wrap-two div.item'); 

$('.wrap h2').each(function(index) { 
    $divs.eq(index).text($(this).text()); 
}); 

// or alternatively: 

var $h2s = $('.wrap h2'); 

$('.wrap-two div.item').text(function(index) { 
    return $h2s.eq(index).text(); 
}); 

DEMO

附加div旨意只是留空，太少div s不是問題也不是。 .eq將始終返回一個jQuery對象，即使具有該索引的元素不存在。然後電話.text將被默默忽略。

還是你想永遠有那麼多div s作爲h2 s？

Answer 2

你也可以clone()第一個列表第二，因爲它們共享相同的.item類：

$('.wrap .item').clone().appendTo('.wrap-two');​ 

http://jsfiddle.net/charlescarver/u2VY5/2/

Answer 3

檢查這個小提琴.. http://jsfiddle.net/u2VY5/3/

$(function(){ 
    $('#btn1').on('click' , function(){ 
     var data = $('.wrap div h2'); 
     var target = $('.wrap-two div'); 

     $.each(data, function(i){ 
      $(target[i]).append('h2').text($(this).text()); 
     }); 

    }); 
});​