Javascript 动态图像加载到svg

情况：在svg中有一个图像：

<filter id="svg-filter-blur">
    <feGaussianBlur stdDeviation="10,10" />
</filter>

<image id='view-photo-svg' x="0%" y="0%" width="100%" height="100%" 
filter="url(#svg-filter-blur)"/>

在

render（）

中：

或

不起作用。 有什么建议吗

完美场景：

• 可以访问图像参数/事件（例如

  onload

  ）

• 可以对其应用过滤器/剪辑

---

必须通过设置非空命名空间中的属性，因此您需要此

photoDOM.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', photo.src);

---

它们当时显然在空名称空间中。几乎每件事都是如此。区别在于有一个冒号（：）啊，我明白了。谢谢你，罗伯特！

var photoDOM = document.getElementById('view-photo-svg');
    photoDOM.setAttribute('src', "url('" + photo.src + "')"); 

    photoDOM.setAttribute('xlink:href', photo.src);

photoDOM.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', photo.src);