js使用json创建动态树

// JSON数据示例
const treeData = {
  name: "Root",
  children: [
    {
      name: "Node1",
      children: [
        { name: "Leaf1" },
        { name: "Leaf2" }
      ]
    },
    {
      name: "Node2",
      children: [
        { name: "Leaf3" }
      ]
    }
  ]
};

// 创建树的函数
function createTree(container, data) {
  const ul = document.createElement('ul');
  const li = document.createElement('li');
  li.textContent = data.name;
  ul.appendChild(li);

  if (data.children && data.children.length > 0) {
    const childrenUl = document.createElement('ul');
    data.children.forEach(child => {
      childrenUl.appendChild(createTree(null, child));
    });
    li.appendChild(childrenUl);
  }

  return ul;
}

// 将树添加到页面中
const container = document.getElementById('tree-container');
container.appendChild(createTree(container, treeData));