Javascript 复制HTML div的值

我有两个元素，它们具有相同的结构，但是id-s和name-s不同。我想将一个div的值复制到另一个div中，保留属性并仅复制值属性

我尝试了以下方法：

$'current-1'.html$'next-1'.html； 当前的一些文本-div1 当前-someelement2的一些文本 下一篇的一些文字 next-someelement的一些文本2

---

为要递归复制的div指定一个类，以便以后可以使用DOM遍历顺序选择它们，然后使用element.cloneNodetrue

输入：

<div class ="recursive" id="current-1">
  <div id="current[1]_div1">Some text for current</div>
</div>
<div class ="recursive" id="next-1">
  <div id="next[1]_div1">Some text for next</div>
</div>

容器是要将元素复制到的div。注意不要将此容器附加到同一文档中，因为重复id会产生问题

用法：

rCopy(document.getElementById("someContainer")) 

window.requestAnimationFrame(function(){rCopy(document.getElementById("current-1"),document.getElementById("next-1"))})

小提琴：

如果要递归地复制当前div的文本节点及其nextElementSibling的文本节点，包括父-子文本节点（如果有），请使用递归函数并与requestAnimationFrame组合，以防止破坏堆栈。我从上到下，上一个兄弟从下一个兄弟得到它的内容，你可以往任何方向走，当一切结束时附加一个回调。以下是一个例子：

输入：

<div class ="recursive" id="current-1">
  <div id="current[1]_div1">Some text for current</div>
  <div id="current[1]_div2">Some text-2 for current
      <div id="current[1]_div3"> Some inner current <br>
          <span>inner inner content current</span>
      </div>
  </div>
</div>
<div class ="recursive" id="next-1">
  <div id="next[1]_div1">Some text for next-1</div>
  <div id="next[1]_div2">Some text-2 for next-1
      <div id="next[1]_div3"> Some inner next-1 <br>
          <span>inner inner content next-1</span>
      </div>
  </div>
</div>
<div class ="recursive" id="next-2">
  <div id="next[2]_div1">Some text for next-2</div>
  <div id="next[2]_div2">Some text-2 for next-2
      <div id="next[2]_div3"> Some inner next-2 <br>
          <span>inner inner content next-2</span>
      </div>
  </div>
</div>

一旦被requestAnimationFrame调用，该链将继续，直到找不到下一个元素同级

小提琴：

---

下面是一个简单的解决方案，它使用.each和每个元素的索引将所有子元素的html从一个元素复制到另一个元素： 这很短，我甚至不知道在代码中注释什么

//在当前的子项中复制下一个的每个子项 $'current-1'。children.eachfunctionindex{ var next=$'next-1'。子项[索引]； $this.html$next.html； }; //在控制台中输出以查看ID log$'current-1'.html； 当前的一些文本-div1 电流标签 当前-someelement2的一些文本 下一篇的一些文字 下一页的标签 next-someelement的一些文本2

---

结构总是一样的吗？还有，这种递归复制是如何实现的？@Luca，结构总是相同的，即当前中存在的元素，下一个中也存在。在这里我只使用了一个例子，但是结构更复杂，为什么不直接引用当前[1]\u div1和下一个[1]\u div1？您的示例并不表明您不能这样做。仅仅增加div计数器是否更有意义？div1->div2？@Luca，我错了，称之为递归。谢谢。如果我知道id属性，那么我可以使用getelementbyid应用您建议的函数吗？我如何指定目标div的名称呢？如果你知道id不会有问题或者目标文档不同，你可以继续使用它。容器是DOM中或不在DOM中的任何节点。要么通过getElementById传递它，要么使用document.createElement创建一个fly。你想要小提琴吗？我是说，我是说，在控制台中，我的一切都像在输入中一样。控制台应该把一切都像在输入中一样，因为你递归地复制了它们。还是我误解了你的问题？也许你误解了。我需要将下一个元素的值复制到current中，保留当前元素的子节点的名称hanks，是否有可能找到forkaround，它适用于所有可能的元素，而不仅仅是div？我的意思是，比如说，如果中间有标签的话。

function rCopy(current,target){
    var sNodes = current.childNodes;
    var tNodes = target.childNodes;
    for (
        var i =0,s=sNodes[i],t=tNodes[i];
        i<sNodes.length;
        ++i,s=sNodes[i],t=tNodes[i]
    ) {
         if (s && t && s.nodeType === 3 && t.nodeType === 3) {
              s.nodeValue = t.nodeValue;
              continue;
         } else if (s && t) {
              !function(current,target){
                  window.requestAnimationFrame(
                      function(){rCopy(current,target)}
                  )
              }(s,t)
         }
    }
  target.nextElementSibling && target.nextElementSibling.className === "recursive" && window.requestAnimationFrame(function(){rCopy(target,target.nextElementSibling)})
}

window.requestAnimationFrame(function(){rCopy(document.getElementById("current-1"),document.getElementById("next-1"))})