我已将 svg 文件加载到“g”中，如下所示( Canvas 基于 Snap-svg):
var _i = new Image();
_i.src = 'svgFile.svg';
$(_i).load(function () {
Snap.load(src, function(f){
_imagen = canvas.g(f.select('*'));
canvas.append(_imagen);
});
svg 文件 (svgFile.svg) 包含(除其他外):
<path id="letterN" fill="#FCEA0D" stroke="#000000" stroke-miterlimit="10" d="M606,538 ... z"/>
外部文件已正确附加，我可以在页面中看到它。但是当我在控制台中查找元素(路径)时，我看到它的 id =“Shyphnh2b1fg”。文件中的所有 svg 元素都会发生这种情况。为什么 id 改变了？更重要的是，如何避免这种情况？任何帮助将不胜感激!
最佳答案
这实际上不是 SVG id，所以我怀疑您看错了。
Snap 添加了自己的 id，如果您查看 Chrome 控制台日志之类的内容，并执行 console.log( someElement )，您将看到该对象将有一个 id，但底层的 SVG 元素(可通过 someElement 访问) .attr 或 someElement.node)，然后将显示实际的 SVG，单击“属性”，您将看到“id”那里有原始的。
所以基本上，您正在查看 Snap 实例 Id，而不是 svg 元素 Id，它们是单独的东西。以下内容应该会有所帮助
console.log( el );
console.log( el.id ); // snap id, don't often need to use this
console.log( el.attr('id') ); // use this normally, snap access to underlying svg id
console.log( el.node.attributes.id.value ); // actual reference to svg id, should be the same as attr('id')
关于javascript - 外部加载的 svg 文件元素的 id，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25238748/