Javascript和svg，将具有函数的项添加到页面

Question

我已经创建了一个Javascript函数来将我的SVG添加到页面中，但是我想要更改形状的颜色，而不必重新绘制形状。

通常的document.getElementById方法不起作用，因为在Javascript函数中创建了形状。

我有什么想法可以解决这个问题？感谢。

Answer 1

由于元素是在javascript中创建的，因此您应该可以访问它。使用元素的fill属性来更改SVG形状的颜色。

element.setAttributeNS(null, 'fill', colorValue)

Answer 2

当您通过Javascript创建和附加svg元素时，您可以在创建时为其指定id。然后你可以通过id访问它。

e.g。

var NS="http://www.w3.org/2000/svg"  
var myCircle=document.createElementNS(NS,"circle")
myCircle.id="circle1"
...

然后，当您想稍后更改填充颜色时，您会：

circle1.setAttribute("fill","red')