使用JQuery动态地将SVG加载到SVGWeb中
我试图动态显示一些SVG内容。 此内容作为字符串存储在我的数据源中。 示例字符串如下所示：
Hello WorldFrom Embedded SVG! 为了适应IE，我正在使用SvgWeb 。 我的问题是，要显示svg内容，我需要将其包装在标记组合中。 我的挑战是，svg正在通过JQuery异步撤回。 而且，据我所知，我无法从JavaScript动态编写“脚本”标签。
如何获取使用JQuery检索并动态显示的SVG内容？
在这里找到了部分答案，并在下面转载。 请注意，此方法强制您在javascript中自己构建根标记和属性，而不是仅加载您在问题示例中的整个svg文档。
动态创建SVG Root元素类似于直接嵌入到网页中。 您不必像在页面加载时直接嵌入SVG那样创建SCRIPT标记：
相反，您遵循类似于上述的过程：
// create SVG root element var svg = document.createElementNS(svgns, 'svg'); // don't need to pass in 'true' svg.setAttribute('width', '300'); svg.setAttribute('height', '300'); // create an example circle and append it to SVG root element var circle = document.createElementNS(svgns, 'circle'); svg.appendChild(circle);
必须使用回调来知道何时将SVG附加到页面（这与标准略有不同）。 以下是支持的方法：
svg.addEventListener('SVGLoad', function() { svg = this; // this will correctly refer to your SVG root alert('loaded!'); }, false); // also supported: svg.onsvgload = function() { alert('loaded!'); }
现在将SVG根添加到我们的文档中
svgweb.appendChild(svg, document.body); // note that we call svgweb.appendChild
请注意，在上面的代码中，我们必须使用事件监听器来了解SVG根目录何时完成加载到页面中; 这与SVG Web魔术所需的标准略有不同。
您附加SVG根目录的父级必须已连接到页面上的真实DOM（即，它不能与页面断开连接）。
您可以使用jQuery SVG插件官方网站已关闭，但需要了解指示 。
您要问的相关部分是本节的答案，我相信..
load（url，settings）此包装器加载外部SVG文档。 请注意，浏览器可能不允许您从原始页面以外的站点加载文档。 如果未提供回调并且出现错误，则会在SVG容器中显示错误消息。
url（字符串）是SVG文档或实际SVG文档内联的位置。
settings（boolean）请参阅下面的addTo或（function）请参阅下面的onLoad或（对象）使用以下属性加载的其他设置：
addTo（boolean，optional）true表示添加到已经存在的内容，或者false（默认值）清除canvas首先将changeSize（boolean，optional）设置为true以允许canvas大小更改，或者false（默认值）保留原始canvas文件加载后，大小onLoad（函数，可选）回调，此函数接收SVG包装器对象和可选的错误消息作为参数，其中这是SVG容器分区。
svg.load('images/rect01.svg', {addTo: true, onLoad: loadDone}); svg.load('', loadDone);
另外，对于踢，这里有一些我用来在循环语句中插入这样一个SVG的PHP代码， 效果很好 ..
if (ICON_FILE_EXT == "svg") { print "\svg.load(\'".ICON_PATH."/directory.svg\', \{addTo\: true, onLoad\: loadDone\}\)\;\<\/script\>";