Javascript遞歸沒有遍歷備份鏈

我想創建一個HTML頁面，這將允許我以大致相同的方式輸出XML文件中的所有節點名稱，例如：：Javascript遞歸沒有遍歷備份鏈

<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中測試這種情況，以防瀏覽器出現一些問題。

來源

2013-08-28 adam5990

你沒有像你認爲的那樣得到孩子。

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是一個長度爲零的序列，您仍然可以正確地對它們進行迭代。

來源

2013-08-28 20:20:27

哇，我是個笨蛋爲沒有看到的是，這解釋了怪異的行爲我一直經歷。所以我想我必須將該行分成兩部分，按名稱在一個變量中獲取標籤，然後遍歷結果並獲取單個子元素？ – adam5990

Nvm，你是絕對正確的，node.childNodes更有意義，歡呼！ – adam5990

這是一種方法來做你想要完成的事情，確保你正確地抓住節點。我使用的所有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>

來源

2013-08-28 20:26:54 crowebird

謝謝你的非常明確的例子，我很欣賞你給出這樣一個完整答案的時間。我接受了@Joshua Taylor的回答，因爲它能更清楚地解決確切的問題。謝謝，但仍然非常有幫助！ – adam5990

Javascript遞歸沒有遍歷備份鏈

回答

相關問題