使用appendChild將SVG元素添加到HTML元素 - 在IE9中失敗？

我正在通過Prototype Ajax Request加載一個SVG文件，向其中添加一個類和一個id，然後將其放入一個div。將它添加到DOM時，我的問題來了：使用appendChild將SVG元素添加到HTML元素 - 在IE9中失敗？

onSuccess: function(response) { 

    var svgElement = response.responseXML.documentElement; 
    svgElement.setAttribute("id", "someId"); 
    svgElement.setAttribute("class", "someClass"); 

    // At this point, everything is fine. I can verify that in IE9, 
    // I have a valid svgElement and the id and class have been correctly set. 

    var someDiv = $('someDiv'); 

    someDiv.appendChild(svgElement); // This fails in IE9, but works elsewhere! 
    someDiv.insert(svgElement.xml); // This works in IE9, but fails elsewhere! 

}

我只關心的一羣更好的瀏覽器 - IE9是我約在這裏擔心的最低水平。

任何ides怎麼了？我臨時切換插入方法取決於我是否在IE中，但我想深入瞭解這一點，並以正確的方式修復它。

來源

2012-03-30 dontGoPlastic

http://stackoverflow.com/questions/8078948/appendchild-with-svg-brings-a-hierarchy-request-err-3-in-ie9-0 – 2012-03-30 03:56:51

http://stackoverflow.com/questions/436710 /元素的appendChild-扼流圈合即 – 2012-03-30 03:57:33

我圍繞「responseXML being in a different document」的問題了，只需通過使用responseText的創建我的文檔中的所有情況下，新：

onSuccess: function(response) { 

    var svgDoc; 

    if (window.DOMParser) { 
     var domParser = new DOMParser(); 
     svgDoc = domParser.parseFromString(response.responseText, "text/xml"); 
    } else { 
     svgDoc = new ActiveXObject("Microsoft.XMLDOM"); 
     svgDoc.async = false; 
     svgDoc.loadXML(response.responseText); 
    } 

    var svgElement = svgDoc.documentElement; 

}

方式比導入文檔更容易和更清潔的（以及所有相關的問題）如果你問我。

來源

2012-04-09 20:56:39 dontGoPlastic

使用appendChild將SVG元素添加到HTML元素 - 在IE9中失敗？

回答

相關問題