获取动态svg内容

Question

我使用snapsvg库从外部svg部件生成svg。这里是主容器：

<svg id="mainContent"></svg> 

当我看着这个元素使用检查我看到里面追加新的动态SVG元素。

我怎样才能得到这个SVG全动态内容将它保存到文件？

Answer 1

必须尝试只是简单地查询它像正常的DOM元素？

var content = document.querySelector('#mainContent').outerHTML 

下载部分，你可以使用saveAs功能现代的浏览器

var blob = new Blob([content], {type: "text/plain;charset=utf-8"}); 
saveAs(blob, "download.svg"); 

看到https://github.com/eligrey/FileSaver.js/

Answer 2

下面的代码片段可以帮助ü下载SVG文件。

function download(filename, text) { var element = document.createElement('a'); element.setAttribute('href','data:text/plain;charset=utf-8,' + encodeURIComponent('<svg>'+text+'</svg>')); element.setAttribute('download', filename); element.style.display = 'none'; document.body.appendChild(element); element.click(); document.body.removeChild(element); } download("samplesvg.svg",document.getElementById('mainContent').innerHTML);