javascript - 通过javascript创建SVG元素

我只需要使用javascript创建此结构:

<svg>
    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#circle"></use>
</svg>

但是我在创建xmlns:xlink属性时遇到了麻烦。这是我的js代码:

var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
var use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
// throws error here
use.setAttributeNS('http://www.w3.org/2000/xmlns', 'xmlns:xlink', 'http://www.w3.org/1999/xlink');
use.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', '#circle');
svg.appendChild(use);

如果我注释设置为xmlns:xlink的字符串都正常工作，并使svg与上述相同，但没有xmlns:xlink。

我看到了很多类似于我的问题，但他们并没有解决我的问题。

最佳答案

关于

use.setAttributeNS('http://www.w3.org/2000/xmlns', 'xmlns:xlink', 'http://www.w3.org/1999/xlink');

您不需要该行，实际上它是无效的。

如果您要在XML文档中创建元素/属性，则在使用createElementNS创建元素或使用setAttributeNS创建属性时会自动设置xmlns:xlink属性，如果在html文档中创建元素，则不需要设置该属性。