JavaScript appendChild Not Working / Completing

时间:2013-04-06 04:27:19

标签: javascript xml appendchild

我一直致力于一个基本上使用存储在XML文件中的数据创建图像映射的项目。据我所知,代码使它到最后但在“mapGoesHere.appendChild(mapStructure);”上失败了。代码行。这是完整的代码...基本上向下滚动到底部以到达processRoomData函数,我认为代码正在死亡:

function loadSingleXML(fileToLoad, howToHandle) {
    var xmlDoc = new ActiveXObject ("Microsoft.XMLDOM");
    xmlDoc.async="false"
    xmlDoc.load(fileToLoad);
    alert("xmldoc.load(fileToLoad)");
    var errorCode = xmlDoc.readyState;
    if (errorCode == 4) {
        howToHandle(xmlDoc);
        alert("howToHandle(xmlDoc)");
    } else {
        alert("Unable to load the document " + url + "\n Error: " + errorCode);
    }
}

function createRoomData(xmlRooms) {
    var roomData = new Array();
    roomData.roomCount   = rooms.length;

    for (var r=0; r<xmlRooms.length; ++r) {
        roomData[r] = new Object();
        roomData[r].portList  = xmlRooms[r].getAttribute("ports");
        roomData[r].number    = xmlRooms[r].getAttribute("number");
        roomData[r].occList   = xmlRooms[r].getAttribute("occupant");
        roomData[r].coordList = xmlRooms[r].getAttribute("coords");
    }               
    return roomData;
}

function createMapStructure (xmlRoomData) {
    var mapStructure;
    var roomData;
    var area;

    rooms    = xmlRoomData.getElementsByTagName("room");
    roomData = createRoomData(rooms);

    mapStructure = document.createElement("map");

    for (var r=0; r<roomData.length; ++r) {
        area = document.createElement("area");
        area.setAttribute("name", roomData[r].numbersList);
        area.setAttribute("shape", "rect");
        area.setAttribute("coords", roomData[r].coordList);
        area.setAttribute("onmouseover", "return overlib('" + roomData[r].portList + "', CAPTION, '" + roomData[r].occList + "');");
        area.setAttribute("onmouseout",  "nd();");

        mapStructure.appendChild(area);
    }
    return mapStructure;
}

var mapLocation = "xml/floorOne.xml";

function processRoomData(mapData) {
    mapStructure = createMapStructure(mapData);
    alert("COMPLETED: createMapStructure");
    mapStructure.setAttribute("name", "PortMap");
    alert("COMPLETED:  setAttribute");
    mapGoesHere = document.getElementById("portNumbs");
    alert("COMPLETED:  getElementById");
    mapGoesHere.appendChild(mapStructure);
    alert("COMPLETED:  appendChild");
}

loadSingleXML(mapLocation, processRoomData);

在底部的processRoomData函数中,我在每个步骤后添加了一个警告,试图弄清楚我的代码挂起的位置。最后一个警报(COMPLETED:appendChild)没有出现,这让我相信代码在特定的代码行上被挂起了。不幸的是,我不太了解编程以了解原因。有人能够善意地指出我的方式的错误,并以新手程序员可以理解的方式解释?谢谢。

编辑: 认为事物的HTML方面也可能是相关的,所以这里是HTML。没有多少。

<html>
    <head>
        <title>Combo Test</title>
        <script type="text/javascript" src="javascript/overlib.js"></script>
        <script type="text/javascript" src="javascript/xml-ie-load.js"></script>
    </head>
    <body>
        <div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>
        <IMG WIDTH="1673" HEIGHT="1293" SRC="images/floor1.png" border="2" ismap usemap="#PortMap" />
        <div id="portNumbs"></div>
    </body>
</html>

编辑:每个请求,这里是一个正在加载的XML的示例:      

<eoc xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
          xsi:noNamespaceSchemaLocation="floor.xsd">
    <facility location="Northpointe">
        <floor level="One">
            <room number=""     occupant="Grace (7126)"      ports="Unknown/Inaccessible"   coords="1448,680,1523,717"/>
            <room number="100"  occupant="Brian (7010)"      ports="001, 002, 003"          coords="465,173,527,214"/>
            <room number=""     occupant="HL-5250DN (6392)" ports="050"                    coords="564,229,580,262"/>
            <room number="101A" occupant="Richard (7038)"   ports="013, 014(C), 015(P)"    coords="554,155,608,203"/>
            <room number="101B" occupant="TBD"              ports="016, 017, 018(C)"       coords="617,155,666,200"/>
            <room number="101C" occupant="Jamie (7173)"     ports="019(C), 020(P), 021"    coords="675,158,730,202"/>
            <room number="101D" occupant="Lucas (7145)"     ports="Unknown/Inaccessible"   coords="737,158,791,200"/>
            <room number="101E" occupant="Dave (7100)"      ports="Unknown/Inaccessible"   coords="799,157,852,198"/>
            <room number="101F" occupant="Eliot (7112)"     ports="028(C), 029(C), 030(P)" coords="859,158,912,198"/>
        </floor>
    </facility>
</eoc>

如果有人想查看完整的工作项目,请访问Firefox或Internet Explorer中的newmap.levitonet.com。在该项目的主页上,我进行了一些浏览器检测,然后加载Firefox或IE版本的javascript文件。除了第一个“loadSingleXML”函数之外,两个文件都是相同的。该项目在Firefox中运行良好,但在Internet Explorer中不起作用。

0 个答案:

没有答案