オブジェクトからツリーを作成

ネストされたオブジェクトからネストされたul/liリストを作成する関数createTreeを作成します。

たとえば

          let data = {
  "Fish": {
    "trout": {},
    "salmon": {}
  },

  "Tree": {
    "Huge": {
      "sequoia": {},
      "oak": {}
    },
    "Flowering": {
      "apple tree": {},
      "magnolia": {}
    }
  }
};
        

構文

          let container = document.getElementById('container');
createTree(container, data); // creates the tree in the container
        

結果(ツリー)はこのようになります。

以下の2つの方法のいずれかでこのタスクを解決してください。

ツリーのHTMLを作成し、次にcontainer.innerHTMLに割り当てます。
ツリーノードを作成し、DOMメソッドで追加します。

両方できれば最高です。

追伸木には、葉のための空の<ul></ul>などの「余分な」要素があってはなりません。

このタスクのサンドボックスを開きます。

オブジェクトをたどる最も簡単な方法は再帰を使用することです。