appendChild with SVG 在 IE9.0 中带来了 HIERARCHY_REQUEST_ERR (3)

Question

以下代码在 chrome 和 Firefox 中运行良好，但在 IE 9.0 中中断

//select div where svg is to be inserted
var selSVG = document.getElementById('SVGMap');
//clear any SVG
while (selSVG.hasChildNodes()) {
selSVG.removeChild(selSVG.lastChild);
}
//add the new svg
selSVG.appendChild(loadXML("roomlayouts/"+SelectedRoomAddress));

使用 loadXML(...) 从另一个文件夹返回 svg 文档，并且在 DOM 异常的最后一行出现错误：HIERARCHY_REQUEST_ERR (3) line 300 character 2

任何想法为什么它不能在 IE 9.0 中工作？

实现在这里：http://chocolatezombies.com/classroom/classroom.html

Answer 1

你需要 import 将加载文档中的元素添加到 selSVG 的文档中，然后才能附加它。根据规格，您会这样做：

var room = loadXML(...);
if (room.nodeType==9){         // You can't import entire documents, so
  room = room.documentElement; // get the root node of the document
}
room = selSVG.ownerDocument.importNode( room );
selSVG.appendChild( room );

但是，IE9 没有正确实现importNode。作为对此问题的回答的一部分，我为此提供了一种解决方法：How do I dynamically insert an SVG image into HTML?