js无限级树形菜单

// 树形菜单数据示例
const menuData = [
  {
    id: 1,
    name: '菜单 1',
    children: [
      {
        id: 2,
        name: '子菜单 1-1',
        children: [
          { id: 3, name: '子菜单 1-1-1', children: [] },
          { id: 4, name: '子菜单 1-1-2', children: [] }
        ]
      },
      { id: 5, name: '子菜单 1-2', children: [] }
    ]
  },
  {
    id: 6,
    name: '菜单 2',
    children: []
  }
];

// 渲染树形菜单的函数
function renderMenu(menu) {
  let html = '<ul>';
  menu.forEach(item => {
    html += `<li>${item.name}`;
    if (item.children && item.children.length > 0) {
      html += renderMenu(item.children);
    }
    html += '</li>';
  });
  html += '</ul>';
  return html;
}

// 将渲染结果显示在页面中
document.getElementById('menu-container').innerHTML = renderMenu(menuData);