克隆一个svg组

Question

我有一个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>

矩形就像一个容器,会发生的是函数克隆矩形并留下其他元素.那有什么不对？

Answer 1

两件事情:

• cloneNode 如果你想要一个深度克隆的树,应该传递true,否则它只会克隆一个元素
• evt.target将永远是事件发生的元素,并且g元素永远不会被直接命中,鼠标事件只是从孩子们那里冒泡到那里.您可以使用evt.currentTarget,如果你想这是当前正在处理该事件(在你的情况,这将是g组件)的元素来代替.