如何在Javascript中为xlink：href声明XML名称空间并下载SVG文件

如何解决如何在Javascript中为xlink：href声明XML名称空间并下载SVG文件

我有一个D3JS树，我想将其下载为SVG。如果我使用以下代码并将其解析为用标记替换第一个和最后一个，则可以成功下载并呈现SVG文件：

$('#download-SVG').click(function() {
var dl = document.createElement('a');
document.body.appendChild(dl); // This line makes it work in Firefox.
dl.setAttribute("href",svgDataURL(svg.node()));
dl.setAttribute("download","test.svg");
dl.click();
});

我将createElement和setAttribute替换为createElementNS和setAttributeNS，如以下代码所示：

$('#download-SVG').click(function() {
    var dl = document.createElementNS('http://www.w3.org/2000/svg','svg');
    dl.setAttribute('viewBox','-2500 -420 6000 10000');
    dl.setAttribute("width","100%");
    dl.setAttribute("height","100%");
    dl.setAttributeNS('http://www.w3.org/1999/xlink','href',svgDataURL(svg.node()));
    document.body.appendChild(dl); // This line makes it work in Firefox.
    dl.setAttribute("download","test.svg");
    dl.click();
   });

function svgDataURL(svg) {
    var svgAsXML = (new XMLSerializer).serializetoString(svg);
    var dataURL = "data:image/svg+xml," + encodeURIComponent(svgAsXML);
    return dataURL;
   }

SVG标签已正确插入，但是，如果尝试在Chrome中打开文件，则会出现以下错误：

error on line 1 at column 45779: Namespace prefix xlink for href on svg is not defined

这是由于未声明xmlns。我猜想setArrtibuteNS会做到这一点！

SVG文件的摘录（来自Chrome Inspect）：

<svg viewBox="-2500 -420 6000 10000" width="100%" height="100%" xlink:href="data:image/svg+xml,%3Cg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20transform%3D%22translate(700%2C25)scale(.7%2C.7)%22%3E%3Cpath%20class%3D%22link%22%20stroke%3D%22%23ccc% …… 3C%2Fg%3E" download="test.svg"></svg>

我也收到错误消息

custom.js:166 Uncaught TypeError: dl.click is not a function

在原始代码中有效。

对这两种方法的任何解释将不胜感激。