JS 함수를 사용하여 트리를 생성 할 수 없습니다.

Question

왜 함수 buildTree이 전체 XML을 반복하지 않습니까? 이 이 이 이

이

으로이 코드에서 볼 수 는,이 노드가

var response = "<scope><friend><name>Alex</name><hobbies><h>music</h><h>salsa</h></hobbies></friend><friend><name>Natasha</name><hobbies><h>hiking</h></hobbies></friend></scope>"; 
 

 
function buildTree(data) { 
 
    treePart = ""; 
 
    treePart += "<ul>"; 
 
    if (data.children.length != 0) { 
 
    for (i = 0; i < data.children.length; i++) { 
 
     treePart += "<li>" + data.children[i].tagName + "<span>[-]</span>"; 
 
     treePart += buildTree(data.children[i]); 
 
     treePart += "</li>"; 
 
    } 
 
    treePart += "</ul>"; 
 
    } 
 
    else { 
 
    treePart += "<li>" + data.innerHTML + "</li>"; 
 
    } 
 
    treePart += "</ul>"; 
 
    return treePart; 
 
} 
 

 
parser = new DOMParser(); 
 
xml = parser.parseFromString(response, 'text/xml'); 
 

 
x = buildTree(xml); 
 
document.getElementById('app').innerHTML = x;

<ul> 
 
    <div id="app"></div> 
 
</ul>

표시되지 않습니다

다음은 XML과 JS 코드입니다. 그것이 돌아갑니다 그렇게하면, h 태그, i=2 반복을 완료 할 때
:

<friend><name>Natasha</name><hobbies><h>hiking</h></hobbies></friend> 

Answer 1

for (i = 0 ...
당신이 "VAR"또는 "하자"와 i을 선언하지 않으면, 그것은 글로벌 범위를 가정 두 번째 friend 태그를 반복 할 때 i < data.children.length은 거짓이며 거기서 멈 춥니 다.

var response = "<scope><friend><name>Alex</name><hobbies><h>music</h><h>salsa</h></hobbies></friend><friend><name>Natasha</name><hobbies><h>hiking</h></hobbies></friend></scope>"; 
 

 
function buildTree(data) { 
 
    treePart = ""; 
 
    treePart += "<ul>"; 
 
    if (data.children.length != 0) { 
 
    // Initialize i with "var" or "let" 
 
    for (var i = 0; i < data.children.length; i++) { 
 
     treePart += "<li>" + data.children[i].tagName + "<span>[-]</span>"; 
 
     treePart += buildTree(data.children[i]); 
 
     treePart += "</li>"; 
 
    } 
 
    // That's one too many </ul> 
 
    //treePart += "</ul>"; 
 
    } 
 
    else { 
 
    treePart += "<li>" + data.innerHTML + "</li>"; 
 
    } 
 
    treePart += "</ul>"; 
 
    return treePart; 
 
} 
 

 
parser = new DOMParser(); 
 
xml = parser.parseFromString(response, 'text/xml'); 
 

 
x = buildTree(xml); 
 
document.getElementById('app').innerHTML = x;

<ul> 
 
    <div id="app"></div> 
 
</ul>