2014-02-28 6 views
1

자바 스크립트에 대한 도움이 필요합니다. XML로 작업 중이므로 자바 스크립트를 구현해야하며 엘리먼트 노드 이름을 정렬하고 싶습니다. 다음 그림을 보면 내가 말하는 것을 분명히 할 수 있습니다. Jquery가 아닌 Javascript로 코드를 작성하고 싶습니다. 자바 스크립트를 사용하여 XML 데이터 정렬

function generate(node) { 
    if (node.nodeType != 1) return ""; 
    var html = "<li>" + node.nodeName; 
    var htmlForChildNodes = ""; 
    for (var i = 0; i < node.childNodes.length; i++) { 
     htmlForChildNodes += generate(node.childNodes[i]); 
    } 
    if (htmlForChildNodes) { 
     html += "<ul>" + htmlForChildNodes + "</ul>"; 
    } 
    html += "</li>"; 
    return html; 
} 

UnSorted:         Sorted: 

bookstore         bookstore 
    xbook           abook 
    title           author 
    author          price 
    year           title 
    price           year 
    cbook          cbook 
    gbook          gbook 
    abook          xbook  


Live Fiddle

답변

1

당신은 XML 문서를 구문 분석하고 객체의 자바 스크립트 배열에 넣어해야합니다 감사합니다. 그것들은 쉽게 분류 할 수 있습니다.

generate(xmlDoc.documentElement)을 호출하는 대신 xml에서 바로 html을 반환하려면 배열 배열을 반환하는 parse(xmlDoc.documentElement) 함수를 추가해야합니다. 그런 다음 generate() 함수를 사용하여 원래 xml dom 대신 배열 인 children 속성을 사용하여 객체를 가져옵니다.

구문 분석은 다음과 비슷한 모습이 될 것

function parse(node) { 
    if (node.nodeType != 1) return null; 
    var result = {name: node.nodeName}; 
    var children = []; 
    for (var i = 0; i < node.childNodes.length; i++) { 
     var child = parse(node.childNodes[i]); 
     if (child) 
     { 
      children.push(child); 
     } 
    } 
    result.children = children; 
    return result; 
} 

이제 your own comparator function을 만들어 아이들과 함께 배열을 정렬 할 수 있습니다.

정렬 후 개체/배열을 반복하여 html을 생성하는 (변경된) generate() 함수를 호출합니다.

Here is a fiddle. generate() 기능의 변경 사항을 남겨 둡니다. (브라우저 콘솔을 사용하여 생성 된 데이터 구조를 검사하십시오.)

+0

선생님 혼란스럽고 생동감이 필요합니다. – user3350333

+0

나는 바이올린으로 업데이트했습니다. –

+0

코드에는 출력이 없습니다. – user3350333

관련 문제