无法使用getElementsByTagName从Javascript中的XML doc中检索节点

时间:2013-08-30 20:35:26

标签: javascript html xml dom

我正在尝试创建一个基本上有两个滚动框的html页面,其中一个我可以查看树状文件中的节点名称视图(我将其设置为创建按钮而不是纯文本),然后,当您在树视图中单击节点名称时,它会在另一个框中显示该节点的值和属性名称。我正在使用w3schoools建议的标准加载方法加载文档

function openSourceXML(){
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
} else {// code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
;
xmlhttp.open("GET",
        "file:///C:/Users/conada/Downloads/FOPwc/dictionary.dic", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
};

我可以用...构建树视图部分没问题。

function start() {  
x = xmlDoc.documentElement;
document.getElementById("root").innerHTML = xmlDoc.documentElement.nodeName;
document.write("<br><b><font color=\"rgb(33,0,255)\" size=\"6\">"
        + x.nodeName + "</b></font>");
printChildren(x, 1);
function printChildren(node, depth) {
    for ( var i = 0; i < node.childNodes.length; ++i) {
        if (node.childNodes[i].nodeName != "#text") {
            document.write("<br>");
            if (depth == 1)
                document.write("<b><font color=\"0000FF\" size=\"5\">");
            if (depth == 2)
                document.write("<font color=\"0088DD\" size=\"4\">");
            if (depth == 3)
                document.write("<font color=\"3318BB\" size=\"4\">");
            if (depth == 4)
                document.write("<font color=\"006688\" size=\"4\">");
            if (depth == 5)
                document.write("<font color=\"00DDFF\" size=\"4\">");
            for ( var j = 0; j < depth; j++) {
                document
                        .write("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp");
            }
            document.write("<button type=\"button\" onClick=\"writeSome(this.value)\" value=\"" + node.childNodes[i].nodeName + "\">" + node.childNodes[i].nodeName +"</button>");

            if (depth == 1)
                document.write("</b></font>");
            if (depth == 2)
                document.write("</font>");
            if (depth == 3)
                document.write("</font>");
            if (depth == 4)
                document.write("</font>");

        };
        printChildren(node.childNodes[i], depth + 1);
    };
};
};

单击该按钮时,它会调用一个函数,并将所选节点的名称传递给该函数。然后,该函数会尝试使用getElementsByTagName来检索所需的节点,但这是一个停止运行的地方。到目前为止,这个函数只是简单地显示了你应该得到的节点的名称,然后在尝试获取节点输出名称(它应该在逻辑上匹配)之后。按钮单击调用的函数是......

function writeSome(value){
currNode=value; 
//output passed string to ensure there is no problem there
document.getElementById("rightPane").innerHTML = currNode + "<br>";
//try to grab the node you want
x = xmlDoc.getElementsByTagName(currNode);
//display the name of the node to ensure the right node was found (should match name passed in)
document.getElementById("rightPane").innerHTML += x.nodeName + "<br>";  
};

这些函数都在我的html外部的一个文件中。为什么getElementsByTagName似乎什么都不做?如果不是这样的话,如何在给定名称的情况下访问特定节点?任何帮助都会很棒,因为我已经用尽了我的想法来解决这个问题。

另外,请注意,我已经验证了一些访问XML文件的功能,比如使用xmlDoc.documentElement来检索根节点,之后的.childNodes遍历文件,但是这个用处不大我,我只是想快速而干净地抓住我正在寻找的特定节点。

2 个答案:

答案 0 :(得分:1)

我认为您的问题可能是您缺少数组索引。 getElementsByTagName返回一个元素数组,您需要指定要使用的元素。

x=xmlDoc.getElementsByTagName(currNode)[0];

答案 1 :(得分:0)

您还应该注意'getElementsByTagName'将返回包含该标记的所有节点的数组,而不仅仅是一个节点(除非您只有一个带有该标记的节点)