漂亮的SVG DOM节点到文件

Question

我正在使用Javascript来允许用户将动态生成的SVG元素导出到文件中。使用Blobs和MouseEvents是一种相当hacky的方法：

var exportSVG = function(sel) {
  var el = document.querySelector(sel);

  var blob = new Blob([el.outerHTML], {encoding:"UTF-8",type:"text/xml;charset=UTF-8"}),
      e    = document.createEvent('MouseEvents'),
      a    = document.createElement('a');

  a.download = "";
  a.href = window.URL.createObjectURL(blob);
  a.dataset.downloadurl =  ['text/xml', a.download, a.href].join(':');
  e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
  a.dispatchEvent(e);
};

exportSVG("#mysvg");

问题是这个SVG的源是在一行。其中一些单线程SVG在我的浏览器中无法正确呈现（混乱的字母） - 如果它们打印得很漂亮就很好！

所以我想用正确的源格式和缩进来保存它们。

我认为我必须改变这个Blob hack，因为它固有地使源一行。是否有像JSON.stringify(el, null, 2)这样的XML？