Question

$.get('path/to/svg.svg', function(data) {
  $('#my-div').html(data);
});

这导致控制台中出现“HIERARCHY_REQUEST_ERR：DOM异常3”。这个概念的所有变化似乎都做同样的事情。如果我复制并粘贴我的实际SVG并用它替换“数据”，它插入就好了。我是否需要以不同方式格式化.svg或以某种方式先解析它，以便浏览器不认为我正在尝试将另一个文档放入我的文档中？

Answer 1

使用jQuery SVG：http://keith-wood.name/svg.html

Answer 2

无论如何，您可以将图片重新加载到<div>：

$('#my-div').css('background-image', "path/to/svg.svg");

Answer 3

尝试查看返回数据的子元素。在我的例子中，第一个孩子是XML节点，第二个孩子是DOCTYPE声明，然后第三个孩子是SVG标签，可以通过.html（）方法添加。但是，除非我在开发人员工具（使用chrome）中切换容器上的某些样式，否则SVG图像仍然无法显示。关闭做一些谷歌搜索。如果我发现任何有用的内容，我会将其添加到本文的评论中。

如何通过JavaScript / jQuery插入SVG内联？

3 个答案: