不規則なJavaScriptオブジェクトからHTMLネストされたリストを構築する（フォルダ構造）

最近、問題が発生しました。不規則なJavaScriptオブジェクトからhtmlネストされたリストを作成する必要があります。（パスはここ ommitedされなければならない）不規則なJavaScriptオブジェクトからHTMLネストされたリストを構築する（フォルダ構造）

var obj = { "Canmon01-srv-13": { "tidata": { "Comite Paritaire SST": { "Securite Machine" : { "01- Development" : { "path": "Canmon01-srv-13/tidata/Comite Paritaire SST/4_Securite_Machine/01 - Developpement" } } } } }, "Cantor-srv-36" : { "TM1-USAEWD01" : { "path": "CANTOR01-SRV-36/TM1-USAEWD01" } }, "FP&A" : { "path" : "FP&A" } }

基本的に私はこれを行うために必要なものをフォルダごとに、ネストされた李さんとULを作成することです：は基本的に私は、ツリーのようにフォルダ構造を表すJavaScriptオブジェクトが持ちます。

私はこの1つのお手伝いを大変ありがとうございます。

ありがとうございます。オブジェクトの

出典

2017-06-29 Greg Szul

、未知の深さのデータ構造を使用すると、通常 – CBroe

可能HTTPSを複製...再帰関数のために行きたいです：//stackoverflow.com/questions/19357176/creating-nested-list-using-json-and-jquery – GavinBrelstaff

深最初のトラバーサルが助けになります

<html> 
 
<body> 
 
    <div id="dir"></div> 
 
</body> 
 
<script> 
 
    var obj = { 
 
     "Canmon01-srv-13": { 
 
      "tidata": { 
 
       "Comite Paritaire SST": { 
 
        "Securite Machine" : { 
 
         "01- Development" : { 
 
          "path": "Canmon01-srv-13/tidata/Comite Paritaire SST/4_Securite_Machine/01 - Developpement" 
 
         } 
 
        } 
 
       } 
 
      } 
 
     }, 
 

 
     "Cantor-srv-36" : { 
 
      "TM1-USAEWD01" : { 
 
       "path": "CANTOR01-SRV-36/TM1-USAEWD01" 
 
      } 
 
     }, 
 

 
     "FP&A" : { 
 
      "path" : "FP&A" 
 
     } 
 
    }; 
 

 
    var traverse = function(node, str) { 
 
     var keys = Object.keys(node); 
 
     if(keys.length === 1 && keys[0] === 'path') { 
 
      str += "</li>"; 
 
      return str; 
 
     } 
 
     str += "<ul>"; 
 
     keys.forEach(k => { 
 
      str += "<li>" + k; 
 
      str = traverse(node[k], str); 
 
     }); 
 
     str += "</ul>"; 
 
     return str; 
 
    }; 
 
    document.getElementById('dir').innerHTML = traverse(obj, ""); 
 
</script> 
 
</html>

出典

2017-06-29 11:02:02

不規則なJavaScriptオブジェクトからHTMLネストされたリストを構築する（フォルダ構造）

答えて

関連する問題