Javascript 将具有相同类的多个元素分发给具有相同类的其他元素

Javascript 将具有相同类的多个元素分发给具有相同类的其他元素,javascript,jquery,html,Javascript,Jquery,Html,Hello需要一些帮助来将具有相同类的多个元素分发给具有相同类的其他多个元素。我想也许吧。Appendo可以帮上忙 我想提出以下建议: ... ... ... ... 其中: ... ... ... ... 所以我有这些: 第一个按钮在第一个按钮的位置等 <div class="button_place"> <div class="button"> ... </div> </div> <div class="bu

Hello需要一些帮助来将具有相同类的多个元素分发给具有相同类的其他多个元素。我想也许吧。Appendo可以帮上忙

我想提出以下建议: ...


...
...
...
其中: ...


...
...
...
所以我有这些: 第一个按钮在第一个按钮的位置等

<div class="button_place">
  <div class="button">
    ...
  </div>
</div>

<div class="button_place">
  <div class="button">
    ...
  </div>
</div>

<div class="button_place">
  <div class="button">
    ...
  </div>
</div>

...
...
...

选择所有按钮和位置。然后迭代按钮并将它们附加到相应的位置容器中

jQuery版本:

const $places = $('.button_place')

$('.button').each(function(i) {
  $places[i].appendChild(this)
})
纯JS版本:

const buttons = document.querySelectorAll('.button')
const places  = document.querySelectorAll('.button_place')

buttons.forEach(function(button, index) {
  places[index].appendChild(button)
})
// NodeList.prototype.forEach is not supported in IE,
// convert NodeList to array first with slice, Array.from, etc.

选择所有按钮和位置。然后迭代按钮并将它们附加到相应的位置容器中

jQuery版本:

const $places = $('.button_place')

$('.button').each(function(i) {
  $places[i].appendChild(this)
})
纯JS版本:

const buttons = document.querySelectorAll('.button')
const places  = document.querySelectorAll('.button_place')

buttons.forEach(function(button, index) {
  places[index].appendChild(button)
})
// NodeList.prototype.forEach is not supported in IE,
// convert NodeList to array first with slice, Array.from, etc.
只需与
$('.button_place')
each()
附加($('.button').eq(a).clone()).html()一起使用即可。
它用于获取
按钮的外部tml

$('.button_place')。每个(函数(a、b){
$(this).append($('.button').eq(a).clone()).html()
})

按钮
按钮
按钮
纽扣店
纽扣店
button_place
只需与
$('.button_place')
each()
append($('.button').eq(a.clone()).html()一起使用即可。
它用于获取
按钮的outerhtml

$('.button_place')。每个(函数(a、b){
$(this).append($('.button').eq(a).clone()).html()
})

按钮
按钮
按钮
纽扣店
纽扣店

按钮放置
选择两个集合,在一个集合上循环,然后附加到另一个集合

var按钮=$(“.button”),
地点=$(“.button_place”);
按钮。每个(功能(i、elem){
places.eq(i).追加(elem)
})
。按钮\u位置{
边框:1px纯红;
}

b1
b2
b3

选择两个集合,在一个集合上循环,然后附加到另一个集合

var按钮=$(“.button”),
地点=$(“.button_place”);
按钮。每个(功能(i、elem){
places.eq(i).追加(elem)
})
。按钮\u位置{
边框:1px纯红;
}

b1
b2
b3

您可以使用以下每个功能进行操作:


如果要替换内容,请使用html函数;如果要在末尾添加内容,请使用append。

您可以使用以下每个函数:


如果要替换内容,请使用html函数;如果要在末尾添加内容,请使用append。

这不仅仅是3个元素,而是20个元素。我需要以这种方式移动。答案仅描述复制操作。移动某物意味着复制和删除。你是在寻找这个动作的答案,还是只寻找复制的答案?这不仅仅是3个元素,而是20个元素。至少我需要这样做。答案只描述复制动作。移动某物意味着复制和删除。您是在寻找此操作的答案,还是只寻找副本?
$(".button_place").each(function(index,elem){
 //$(elem).html($(".button").eq(0));
 $(elem).append($(".button").eq(0));
})