在JS中如何将一个XML对象添加到SVG中，实现动态加载

我正在做一个SVG发布图，以一个SVG图做底图，在上面标注设备等，我希望实现在地图加载完成之后，再加载上面的设备图型。这些设备图和底图分别放在两个s文件中，现在我遇到的问题是，无法将设备图形加入到SVG中，我的测试代码如下：
var svg1 = document.embeds("webBrush");
var s="<rect id=\"rect_276657302\" x=\"215\" y=\"267\" height=\"78\" width=\"165\" stroke=\"red\" stroke-width=\"1\" fill=\"white\" fill-opacity=\"0\" stroke-dasharray=\"none\"/>";var node1 =svg1.window.parseXML(s);
//alert(node1.documentElement);
var obj=svgDocument.getElementById("drawBoard"); //添加设备的位置
obj.appendChild(node1.documentElement); //这里出错//alert(svg1.window.printNode(obj));请指教

解决方案 »

  1.   

    file "a.htm";
    <html>
    <head>
    <script language="javascript">
    function window.onload()
    {
    var svgDocument=document.webBrush.getSVGDocument();
    var svg1 = document.embeds("webBrush");
    var s="<rect id=\"rect_276657302\" x=\"215\" y=\"267\" height=\"78\" width=\"165\" stroke=\"red\" stroke-width=\"1\" fill=\"white\" fill-opacity=\"0\" stroke-dasharray=\"none\"/>"; var node1 = svg1.window.parseXML(s);
    alert(node1.documentElement);
    var obj=svgDocument.getElementById("drawBoard");
    // obj.appendChild(node1.documentElement);alert(svg1.window.printNode(obj));}
    </script>
    </head>
    <body>
    <embed id="webBrush" name="webBrush" src="MySVG.svg" width="900" height="640" type="image/svg-xml"></embed>
    </body>
    </html>MySVG.svg<?xml version="1.0" standalone="no"?>
    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
      "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
    <svg width="400" height="200" preserveAspectRatio="xMidYMid meet" zoomAndPan="magnify" xmlns="http://www.w3.org/2000/svg">    <desc>Basic shapes</desc>    <g>    <circle cx="50" cy="50" r="25"/>    <ellipse cx="75" cy="125" rx="50" ry="25"/>    <rect x="155" y="5" width="75" height="100"/>    <rect x="250" y="5" width="75" height="100" rx="30" ry="20"/>    <line x1="0" y1="150" x2="400" y2="150" stroke-width="2" stroke="blue"/>    <polyline points="50,175 150,175 150,125 250,200"/>    <polygon points="350,75 379,175 355,175 355,200 345,200                                         345,175 321,175"/>    <rect x="0" y="0" width="400" height="200" fill="none" stroke="red" stroke-width="3"/>  </g>
    <g id="drawBoard" >
    </g>
    </svg>
      

  2.   

    其中a.htm文件第13行
    obj.appendChild(node1.documentElement);
    被我注释掉了，就是这行出错