从七巧板看SVG 层次 置顶问题 （z-index无效解决方案）

svg与H5标准不完全兼容，许多css属性并不适用与svg，包括 z-index；
svg中的元素只会按照生成顺序层叠。所以，修改svg中元素层叠关系只能重写svg的innerHTML了。

思路

目标：将选中的元素置顶。
实现：先移除此节点，再重新添加此节点。

$("#p").append($(this).detach());

detach() 方法移除被选元素，包括所有文本和子节点。这个方法会保留 jQuery 对象中的匹配的元素，因而可以在将来再使用这些匹配的元素。detach() 会保留所有绑定的事件、附加的数据，这一点与 remove() 不同。

【具体实例:svg七巧板】

    
    
    
    
    
    




    顺时针1°
    顺时针10°
    逆时针10°
    逆时针1°


    请在移动设备上玩耍，单指移动，长按0.5s呼出旋转菜单，不允许放大。