Question

我正在尝试创建一个HTML页面，它允许我输出XML文件中元素的所有节点名称，或多或少与读取它们相同，例如：

<a>
 <b>
  <c></c>
 </b>
 <d>
  <e></e>
 </d>
</a>

会输出：

a
 b
  c
 d
  e

我正在使用Javascript函数以递归方式遍历XML文档来实现此目的。但是，我创建的函数只遍历最低级别然后停止，产生，例如：

a
 b
  c

这是我的Javascript功能

function printChildren(node){
 if(node.childNodes.length > 1){
  y=xmlDoc.getElementsByTagName(node.nodeName)[0].childNodes;
  for(i=0;i<y.length;i++){
   if(y[i].nodeName!="#text"){
    document.write("<br>--->" + y[i].nodeName);
    alert(y[i].nodeName);
    printChildren(y[i]);
   };
  };
 };
};

我不确定我的方法是否错误，或者在完成第一级递归后函数是否正在崩溃。我正在Mozilla Firefox中对此进行测试，以防它是由于浏览器的一些怪癖。

Answer 1

这是完成您要完成的任务的一种方法，请确保正确抓取节点。我使用了所有HTML来演示（JSFIDDLE：http://jsfiddle.net/6WNdZ/ - 小提琴似乎只在你点击运行后出现）：

<hmtl>
    <head>
        <script>
            function printChildren(node, depth) {
                if (!depth) { depth = 1; }
                for(var x = 0; x < node.childNodes.length; ++x) {
                    if (node.childNodes[x].nodeName == '#text') { continue; }
                    var space = '';
                    for(var y = 0; y < depth; ++y) {
                        space += "&nbsp;&nbsp;";
                    }
                    document.write(space + node.childNodes[x].nodeName + "<br />");
                    printChildren(node.childNodes[x], depth + 1);
                }
            }

            window.onload = function() {
                var root = document.getElementById('container');
                printChildren(root);
            }
        </script>
    </head>
    <body>
        <div id='container'>
            <a>
                <b>
                    <c></c>
                </b>
                <d>
                    <e></e> 
                </d>
            </a>
        </div>
    </body>
</html>

Answer 2

你没有像你认为的那样接待孩子。

if(node.childNodes.length > 1){

在这里，您只访问具有多个子节点的节点，但您似乎也想访问节点的单个子节点，不是吗？然后，当您实际使用

检索孩子时

  y=xmlDoc.getElementsByTagName(node.nodeName)[0].childNodes;

如果有多个与node同名的元素，请考虑会发生什么。每次访问其中一个时，您将使用该名称迭代第一个节点的子节点。在您的示例中，这不会发生，但如果您有

<a>
  <b><c1></c1></b>
  <b><c2></c2></b>
</a>

然后当您尝试访问第二个b元素时，您将检索第一个b元素的子元素。为什么不只是node.childNodes？然后你可以这样做：

y=node.childNodes;
for(i=0;i<y.length;i++){

没有检查node个孩子的数量;如果它为零，那么childNodes是一个长度为零的序列，你仍然可以正确地迭代它们。

Javascript递归不会遍历链

2 个答案: