js 片段，展开菜单项

刚花了一整天折腾简化界面的代码片段

其中有一段感觉可以单独抽出来分享，做个预览吧，也不确定是不是已经有同样的插件了。

效果如下 —— 将原本分组的按钮往上一级菜单放。

个人使用场景是配合隐藏菜单按钮后，将原本内层的选项摆到一级菜单中。

脚本代码如下，参考了论坛里的脚本和 GPT 辅助后，目前勉强能跑通。

const config = {
    exposeItem: [
        "段落",
        ["复制", 1, "group"],
        {
            "label": "在新窗口打开",
            "levels": 2
        }
    ]
};

function moveSubMenuItems(thisNode, parentLabel, levels = 1, type = 'item') {
    try {
        const parentMenu = thisNode.querySelectorAll(".b3-menu__item");
        parentMenu.forEach(menuItem => {
            const label = menuItem.querySelector(".b3-menu__label");
            if (label && label.innerText === parentLabel) {
                if (type === 'item') {
                    moveSubMenuItemsToParent(menuItem, levels);
                } else if (type === 'group') {
                    moveSubMenuGroupToParent(menuItem, levels);
                }
            }
        });
    } catch (e) { }
}

function moveSubMenuItemsToParent(menuItem, levels) {
    if (levels <= 0) return;
    if (menuItem.id === 'commonMenu') return;

    let subMenu = menuItem.parentNode.parentNode;
    if (subMenu && subMenu.id !== 'commonMenu') {
        let posItem = subMenu.parentNode;
        let parMenu = posItem.parentNode;
        if (parMenu && parMenu.className === 'b3-menu__items') {


            parMenu.insertBefore(menuItem, posItem.nextSibling);

        }
    }

    if (levels > 1) {
        moveSubMenuItemsToParent(menuItem, levels - 1);
    }
}

function moveSubMenuGroupToParent(menuItem, levels) {
    if (levels <= 0) return;
    if (menuItem.id === 'commonMenu') return;
    let menuItems = menuItem.parentNode;
    let subMenu = menuItems.parentNode;
    let curItem = subMenu.parentNode;

    if (subMenu && subMenu.id !== 'commonMenu') {
        let parMenu = curItem.parentNode;
        if (parMenu && parMenu.className === 'b3-menu__items') {
            while (menuItems.firstChild) {
                parMenu.insertBefore(menuItems.firstChild, curItem.nextSibling);
            }
            curItem.remove();
        }
    }

    if (levels > 1) {
        moveSubMenuGroupToParent(curItem, levels - 1);
    }
}


const observer = new MutationObserver(mutations => {
    mutations.forEach(mutation => {
        if ((mutation.type === "childList" && mutation.addedNodes.length > 0) || mutation.type === "characterData") {
            let thisNode = mutation.addedNodes[0];
            if (thisNode) {
                config.exposeItem.forEach(function (item) {
                    let label, levels, type;
                    if (Array.isArray(item)) {
                        label = item[0];
                        levels = item[1];
                        type = item[2];
                    } else if (typeof item === 'object') {
                        ({ label, levels = 1, type = 'item' } = item);
                    } else {
                        label = String(item);
                        levels = 1;
                        type = 'item';
                    }
                    console.log(label, levels, type);

                    moveSubMenuItems(thisNode, label, levels, type);
                });
            }
        }
    });
});

observer.observe(document.body, {
    attributes: true,
    characterData: true,
    childList: true,
    subtree: true
});