XML 문자열에서 jstree 채우기

Question

XML 문서를 설명하는 문자열의 데이터로 jstree 컨테이너를 채우려고합니다. 여기 내 코드는 간단한 XML 문서로,이다 :

var xmlText = "<root>A<node>B</node></root>"; 
var xml = (new DOMParser()).parseFromString(xmlText,'text/xml');  
$('#jstree').jstree({"core": {data: xml.documentElement}}); 

(도에 codepen : http://codepen.io/szymtor/pen/XKqApq/).

결과는 잘 구성된 트리이지만 노드 레이블이 없습니다 (아래 이미지 참조). 노드 레이블을 어떻게 제공해야합니까? 아니면 내가 잘못하고있는거야? XML에 대한

Answer 1

지원은 제한 보인다. 버전 3의 설명서는 이전 버전에 XML 지원을 위해 활성화 할 수있는 xml_data plug-in이 있었지만 HTML 또는 JSON 입력이 jstree() 인 경우에만 설명합니다.

function xmlToJson(xmlNode) { 
 
    return { 
 
     text: xmlNode.firstChild && xmlNode.firstChild.nodeType === 3 ? 
 
        xmlNode.firstChild.textContent : '', 
 
     children: [...xmlNode.children].map(childNode => xmlToJson(childNode)) 
 
    }; 
 
} 
 

 
var xmlText = "<root>A<node>B<node>C</node></node></root>"; 
 

 
var xml = (new DOMParser()).parseFromString(xmlText,'text/xml'); 
 

 
$('#jstree').jstree({ 
 
    core: { 
 
     data: xmlToJson(xml.documentElement) 
 
    } 
 
});

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script> 
 
<div id="jstree"> 
 
</div>

:

function xmlToJson(xmlNode) { 
    return { 
     text: xmlNode.firstChild && xmlNode.firstChild.nodeType === 3 ? 
        xmlNode.firstChild.textContent : '', 
     children: [...xmlNode.children].map(childNode => xmlToObject(childNode)) 
    }; 
} 

이 예를 참조하십시오

난 그냥이 기능으로 JSON에 XML 변환하여,이 문제를 해결할 것이라고 제안