如何使用这个 UTF-8 SVG 字符串来获取 <svg>？

问题描述

我正在使用 domtoimage 尝试将我的 html div 转换为 <svg>。 domtoimage 中的函数返回字符串：
data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="288" height="1920"> .......... </svg>

我可以将此字符串设置为 src 的 <img>，但我使用的其他插件 (jsPDF) 无法使用它，它需要 <svg>。

我想我可以去掉开头部分，只在文档中添加 svg 标签，但这会导致一个非常奇怪的 svg，到处都是“%0A”，我无法从字符串中删除它。

>

解决方法

如果这是您的代码；问题是：

您正在将文本塞入仅接受 DOM 节点的 append 函数。

只有 .innerHTML 将 字符串 转换为 HTML

如果您为 append 函数提供一个字符串.. 它将显示为一个字符串。

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

注意文档：DOMString 对象作为等效的 Text 节点插入。

解决方案是创建一个 SVG DOM 元素

let svgElem = document.createElementNS("http://www.w3.org/2000/svg","svg");
svgElem.innerHTML = mySvg;
$('body').append(svgElem);