javascript - 如何在div中触发javascript时将整个div复制到另一个div

Question

我有两列。人们必须从第一列中选​​择元素，并将其添加到第二列。

我可以使用innerHTML，但我永远不知道会有多少元素。因此，当我单击链接“MOVE”时，我必须知道元素的 ID(在示例中为 element1、element2 或 element3)。有人知道我如何获取 javascript 触发的父 div 的父级吗？

像这样:

<div id="column1">
  <div id="element1">random tekst 1
      <div id="right">
          <a href="#" onclick="copy()">MOVE</a>
      </div>
  </div>
  <div id="element2">random tekst 2
      <div id="right">
          <a href="#" onclick="copy()">MOVE</a>
      </div>
  </div>
  <div id="element3">random tekst 3
      <div id="right">
          <a href="#" onclick="copy()">MOVE</a>
      </div>
  </div>
</div>

<div id="column2">

</div>

Answer 1

您可以将 anchor 元素的引用传递给函数副本，并使用 parentNode 属性来获取直接父元素。

<a href="#" onclick="copy(this)">MOVE</a>

function copy(elem)
{
    alert(elem.parentNode.parentNode)
}

参见parentNode

您的完整复制功能将是

    function copy(elem)
    {
        var target = document.getElementById ( "column2");
        target.appendChild ( elem.parentNode.parentNode );
    }

<强> Working Demo

注意

您的 HTML 也有问题。您有多个具有相同 id 的元素。这是无效的。您有多个具有相同 id“right”的 div 元素。将它们更改为唯一的 ID。