克隆svg组

我有一个svg组，其中包含一些元素，我想克隆该组，问题是该函数只克隆该组的一个元素。 下面是函数

 <script type="text/ecmascript"><![CDATA[
    function clone(evt) {
        var cloneElement = evt.target.cloneNode(false);
        var newx = 100;
        var newy = 500;
        cloneElement.setAttributeNS(null,"x",newx);
        cloneElement.setAttributeNS(null,"y",newy);
        document.getElementById("layer1").appendChild(cloneElement);
    }

]]></script>

svg看起来像

<g id="layer1" onclick="clone(evt)">
<rect>
<path>
<circle>
<circle>
</g>

矩形就像一个容器，函数会克隆矩形并留下其他元素。 那怎么了？

有两件事：

• 如果需要深度克隆的树，则应将克隆节点传递为true，否则它将只克隆一个元素

• evt.target

  将始终是事件发生的元素，而g元素永远不会直接命中，鼠标事件只是从子元素冒泡到那里。如果您想要当前正在处理事件的元素（在您的情况下是g元素），则可以使用

  evt.currentTarget

---

成功了！但是克隆对象的坐标没有更改为新的坐标，所以我猜我做错了……根据svg规范，g元素没有“x”和“y”属性，但是您可以使用transform=“translate（x，y）”来代替。