使用xlink加载svg图像(Chrome)

Question

谁能帮我找出为什么Chrome不能加载第一张图片？在Firefox和Safari上进行了测试，两者都很好。

我创建了两个iframe，其中一个加载了一个动态生成的svg图像，其中包含一个协议无关的url：

img1.setAttributeNS('http://www.w3.org/1999/xlink', 'href', url);

第二个使用绝对url。

img2.setAttributeNS('http://www.w3.org/1999/xlink', 'href', 'http:'+url);

为什么Chrome不想加载第一张图片？

演示在这里：

http://jsfiddle.net/ioowilly/QbA2T/

Answer 1

根据代码在chrome中的工作情况更改代码

img1.setAttributeNS('http://www.w3.org/1999/xlink', 'href', 'http:'+url);

Answer 2

试试这个：

http://jsfiddle.net/QbA2T/1/

img1.setAttributeNS('http://www.w3.org/1999/xlink', 'href', 'http:'+url);

您在第一张图片中遗漏了'http‘+ url。

编辑：

问题是如果没有http，它就不能计算字符串，最后的值是一个字符串：

 value is the desired string value of the new attribute.

https://developer.mozilla.org/en-US/docs/Web/API/Element.setAttributeNS

它将被添加到您的元素中，但没有任何效果。