json to nested ul li jquery/javascript

Question

ドラッグ＆ドロップビルダーからjavascriptを使用して動的jsonを作成していますが、今はjsonをNested Ul liに変換できません。 jsonは以下の通りです。

[ 
    { 
    "id": "11", 
    "name": "BALANCE" 
    }, 
    { 
    "id": "p1", 
    "name": "Conditions", 
    "nodes": [ 
     { 
     "id": "p1-13", 
     "name": "SPINAL CORD INJURY", 
     "nodes": [ 
      { 
      "id": "p1-13-12", 
      "name": "STROKE", 
      "nodes": [ 
       { 
       "id": "p1-13-12-17", 
       "name": "REACHING" 
       } 
      ] 
      } 
     ] 
     } 
    ] 
    }, 
    { 
    "id": "p1-16", 
    "name": "STRETCHES" 
    }, 
    { 
    "id": "p1-11", 
    "name": "BALANCE" 
    } 
] 

Answer 1

あなたはfunctionを作成し、項目にnodesがある場合は、再帰的に呼び出すことができます。

var json = [{"id":"11","name":"BALANCE"},{"id":"p1","name":"Conditions","nodes":[{"id":"p1-13","name":"SPINAL CORD INJURY","nodes":[{"id":"p1-13-12","name":"STROKE","nodes":[{"id":"p1-13-12-17","name":"REACHING"}]}]}]},{"id":"p1-16","name":"STRETCHES"},{"id":"p1-11","name":"BALANCE"}]; 
 

 
function createUl(data, $elm) { 
 
    data.forEach(function(item) { 
 
    var $li = $('<li><span>' + item.name + '</span></li>'); 
 
    $elm.append($li); 
 

 
    if (item.nodes) { 
 
     var $ul = $('<ul></ul>'); 
 
     $li.append($ul); 
 
     createUl(item.nodes, $ul); 
 
    } 
 
    }); 
 
}; 
 

 
createUl(json, $('ul'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul></ul>