无法获得SVG＆＃39;使用＆＃39;工作，如果动态创建

Question

SVG有一个很棒的symbol / use系统，可以在图标只有一个，然后使用use将它们放在SVG周围。只有我无法通过JavaScript工作。

请参阅此fiddle。

以编程方式创建的use节点在浏览器的DOM中可见，并且与静态创建的节点相同。但只有静态的可见。

你能解释一下发生了什么吗？

---

symbol与defs非常相似，但允许在符号旁边定义viewBox，从而使条目的缩放更容易，并使代码更清晰。我可以和defs合作，但我也遇到了类似的问题。

注意：我的JavaScript在HTML端，而不在SVG中。我想这样做。

Answer 1

我认为你的小提琴中有一个拼写错误（xref vs href）：

use.setAttributeNS( xlinkns, "xlink:xref","#tri");

intead of

use.setAttributeNS( xlinkns, "xlink:href","#tri");