为什么我的SVG是通过javascript加载的？

我正在尝试通过javascript加载svg。我得到的只是一个空白屏幕，如果我检查它，我会看到代码，但是svg没有呈现出来。如果将链接粘贴到浏览器中，则可以看到图像。感谢您的帮助

谢谢

var ajax=new-XMLHttpRequest（）；
open（“GET”https://edit.meridianapps.com/api/floors/5649391675244544.svg?namespace=4906933713108992_1&hash=8f1c6699ad05ff6ca0ba9414884546b1&style=6711e01fe4271fa2fd1f299eff4296da&default_style=original“，对）；
ajax.send（）；
ajax.onload=函数（e）{
var div=document.getElementById（“svgContainer”）；
div.innerHTML=ajax.responseText；
}

---

检查CSS文件中的id“svgContainer”，无论您是否提供了某种样式。 您的问题或多或少看起来像是样式问题

问题是您需要首先导入文档，即responseXML位于另一个DOM文档中。 要插入文档，您需要使用

document.importNode

要获得更多的澄清，您可以遵循以下步骤

---

这个问题似乎与Ajax调用无关。您的代码与其他代码一起工作

问题似乎与SVG有关。通过

img

标签将其包括在内可以正常工作。在HTML中直接包含SVG标记显示了与您描述的相同的问题

Chrome和Firefox都显示大的viewbox，但不呈现任何图像内容

讨论中的SVG在所有SVG标记前面加上名称空间前缀

ns0

。正如一位评论员所建议的，从所有标签中删除这个前缀是成功的——Chrome和Firefox会显示图像

但是，建议的简单文本替换是一个弱的解决方案：如果前缀更改（这是SVG创建者设置的任意字符串），图像将再次不显示。此外，文本替换可能会删除图像源中出现的非名称空间前缀的

ns0

，可能会破坏图像或更改其内容

虽然我找不到内联这种SVG文件的标准方法的答案，但我建议使用图像标记并将源代码设置为URL

<img id="svgContainer">

var img = document.getElementById("svgContainer");
img.src = "https://example.com/image.svg";

---

正如enxaneta在评论中所说的
div.innerHTML=ajax.responseText.replace（/ns0:/g，“”）
解决了以下问题


var ajax=new-XMLHttpRequest（）；
open（“GET”https://edit.meridianapps.com/api/floors/5649391675244544.svg?namespace=4906933713108992_1&hash=8f1c6699ad05ff6ca0ba9414884546b1&style=6711e01fe4271fa2fd1f299eff4296da&default_style=original“，对）；
ajax.send（）；
ajax.onload=函数（e）{
var div=document.getElementById（“svgContainer”）；
div.innerHTML=ajax.responseText.replace（/ns0:/g，“”）；
}
您应该使用Tag for ajax让我们知道您正在使用ajax尝试以下操作：
div.innerHTML=ajax.responseText.replace（/ns0:/g，“”）
谢谢您，您的解决方案在@enxaneta下运行良好。替换的原因是什么？svg元素中的每个标记都以名称空间
ns0
作为前缀，而这对XML有效，但对HTML无效。由于
ajax.responseText
是一个字符串，我从每个标签中删除了名称空间，这样它就可以在HTMLI中工作。我不这么认为，这是一个完全没有css的小提琴。对，那么svg有什么问题呢？为什么在通过js插入文本时，它会加载到img标签中，而不是加载？我更新了答案，以解决潜在问题和潜在解决方案。谢谢，请详细说明发生了什么以及为什么？虽然这个答案确定了问题，使用字符串替换操作SVG源代码容易出错，应该避免。
replace（）
是js函数，它在响应文本中查找
ns0:
子字符串，并将其替换为
”
，以生成正确的
HTML
标记
<img id="svgContainer">

var img = document.getElementById("svgContainer");
img.src = "https://example.com/image.svg";