bootstrap 树形组件

Bootstrap提供了一个名为"Treeview"的组件，可以用来创建树形结构的菜单或者导航。

要使用Bootstrap的Treeview组件，需要引入以下两个文件：

<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-treeview/1.2.0/bootstrap-treeview.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-treeview/1.2.0/bootstrap-treeview.min.js"></script>

然后，可以使用以下代码创建一个简单的树形菜单：

<div id="treeview"></div>

<script>
    var treeData = [
        {
            text: "Parent 1",
            nodes: [
                {
                    text: "Child 1",
                    nodes: [
                        {
                            text: "Grandchild 1"
                        },
                        {
                            text: "Grandchild 2"
                        }
                    ]
                },
                {
                    text: "Child 2"
                }
            ]
        },
        {
            text: "Parent 2"
        },
        {
            text: "Parent 3"
        }
    ];

    $('#treeview').treeview({
        data: treeData
    });
</script>

以上代码将创建一个包含三个父节点的树形菜单，其中第一个父节点包含两个子节点，第一个子节点包含两个孙子节点。

可以根据需要修改数据和样式来创建自定义的树形菜单。