Javascript Snap.svg的多个实例导致损坏

我希望在一个网页上显示几个SVG，每个SVG都在一个单独的DOM元素中，我正在加载这些元素，然后使用Snap.SVG（v0.5.1）进行操作。SVG是在Illustrator中创建的

页面上的单个svg按预期加载并设置动画。但是，当尝试加载多个SVG时，至少有一个SVG会出现小的损坏。我怀疑我使用的Snap不正确，但在同一页面上找不到将其加载到单独DOM元素的示例

   var s=Snap(".dom-element");
   Snap.load("my-pic1.svg", onSVGLoaded );
   function onSVGLoaded( data ){ 
      s.append( data );
      //do something
   }

   var s2=Snap(".dom-element2");
   Snap.load("my-pic2.svg", onSVGLoaded2 );
   function onSVGLoaded2( data ){ 
       s2.append( data );
       //do something
    }

    var s3=Snap(".dom-element3");
    Snap.load("my-pic3.svg", onSVGLoaded3 );
    function onSVGLoaded3( data ){ 
        s3.append( data );
        //do something
    }

---

是否有另一种方法可以将多个svg加载到单个元素中，而无需每次调用Snap的新实例（如果这是问题所在）？

svg文件是否具有重复的id值？所有ID必须是唯一的。如果您将所有3个SVG加载到同一个文档中，那么即使在这些文件中也不能有重复。您的评论解决了我的问题。虽然它不是id，但Illustrator为每个SVG命名的类都是相同的，因此相互冲突。Illustrator需要一种在导出SVG时向类添加后缀的方法。感谢您的帮助。SVG文件是否具有重复的id值？所有ID必须是唯一的。如果您将所有3个SVG加载到同一个文档中，那么即使在这些文件中也不能有重复。您的评论解决了我的问题。虽然它不是id，但Illustrator为每个SVG命名的类都是相同的，因此相互冲突。Illustrator需要一种在导出SVG时向类添加后缀的方法。谢谢你的帮助。