js显示树形结构

<ul id="treeContainer">
    <!-- 树形结构将在这里动态生成 -->
</ul>

// 树形结构的数据
const treeData = {
    name: "根节点",
    children: [
        {
            name: "子节点1",
            children: [
                { name: "子节点1-1" },
                { name: "子节点1-2" }
            ]
        },
        {
            name: "子节点2",
            children: [
                { name: "子节点2-1" }
            ]
        }
    ]
};

// 递归函数，用于生成树形结构的HTML
function generateTree(data, container) {
    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 => {
            generateTree(child, childrenUl);
        });
        li.appendChild(childrenUl);
    }

    container.appendChild(ul);
}

// 调用函数，传入数据和容器元素
const treeContainer = document.getElementById('treeContainer');
generateTree(treeData, treeContainer);