希望鼠标悬浮自动展开大纲

我让 GPT 辅助写了一个 JS 片段，基本能实现，但我感觉交互很奇怪：

// 鼠标移动到大纲标题自动展开与折叠下级 JS片段

setTimeout(() => {
    const headings = document.querySelectorAll('li.b3-list-item[data-type="NodeHeading"]');

    headings.forEach((heading) => {
        let hideTimeout;
        let removeTimeout;
        let isMouseInHeading = false; // 标志变量，跟踪鼠标是否在 heading 内
        let isMouseInSubMenu = false; // 标志变量，跟踪鼠标是否在子菜单内

        // 鼠标进入列表项
        heading.addEventListener('mouseenter', () => {
            isMouseInHeading = true; // 设置标志变量
            clearTimeout(removeTimeout); // 清除可能存在的移除定时器

            let nextElement = heading.nextElementSibling;
            if (nextElement && nextElement.tagName.toLowerCase() === 'ul') {
                removeTimeout = setTimeout(() => {
                    if (isMouseInHeading) {
                        nextElement.classList.remove('fn__none');
                    }
                }, 200); // 延迟 200ms 后再移除 fn__none
            }
        });

        // 鼠标离开列表项
        heading.addEventListener('mouseleave', () => {
            isMouseInHeading = false; // 更新标志变量
            hideTimeout = setTimeout(() => {
                let nextElement = heading.nextElementSibling;
                if (nextElement && nextElement.tagName.toLowerCase() === 'ul' && !isMouseInSubMenu) {
                    nextElement.classList.add('fn__none');
                }
            }, 200); // 延迟 200ms 后再添加 fn__none
        });

        // 鼠标移动到 ul > li 上时，阻止 fn__none 添加
        let nextElement = heading.nextElementSibling;
        if (nextElement) {
            nextElement.querySelectorAll('li').forEach((ulItem) => {
                ulItem.addEventListener('mouseenter', () => {
                    isMouseInSubMenu = true; // 更新标志变量
                    clearTimeout(hideTimeout); // 清除定时器，防止隐藏
                    clearTimeout(removeTimeout); // 清除移除定时器
                });

                ulItem.addEventListener('mouseleave', () => {
                    isMouseInSubMenu = false; // 更新标志变量
                    hideTimeout = setTimeout(() => {
                        if (nextElement) {
                            nextElement.classList.add('fn__none');
                        }
                    }, 200);
                });
            });
        }
    });

}, 1000);

为什么我添加了你的 js 代码却无法运行功能呢？我的版本的是 3.1.6

这个脚本我在思源的代码片段里加载之后，没有作用哎，请问应该如何使用呢？