[js] 折叠 / 展开所有搜索结果

在搜索页面增加两个按钮, 折叠和展开, 用于折叠/展开 搜索结果的文档

// [js] 折叠/展开所有搜索结果
(() => {
    // 定义目标元素和要插入的 HTML 内容
    const targetId = "searchPath";
    const insertHTML = `
    <span class="fn__space"></span>
    <span id="foldAllSearchRes" aria-label="折叠全部" class="block__icon block__icon--show ariaLabel" data-position="9south">
        <svg><use xlink:href="#iconContract"></use></svg>
    </span>
    <span class="fn__space"></span>
    <span id="expandAllSearchRes" aria-label="展开全部" class="block__icon block__icon--show ariaLabel" data-position="9south">
        <svg><use xlink:href="#iconExpand"></use></svg>
    </span>
`;

    // 创建函数来检查元素并添加内容和事件监听
    function checkAndAddElements() {
        const searchPathInput = document.getElementById(targetId);
        if (!searchPathInput) return;
        // 确保只执行一次
        if (document.getElementById("foldAllSearchRes")) return;

        // 在 searchPathInput 后插入内容
        searchPathInput.insertAdjacentHTML('afterend', insertHTML);

        // 添加点击事件监听
        document.getElementById("foldAllSearchRes").addEventListener("click", () => {
            console.log("折叠全部搜索文档");
            // 在这里实现折叠功能
            document.querySelectorAll('.b3-dialog__container .b3-list-item__arrow.b3-list-item__arrow--open').forEach(arr => {
                arr.parentElement.click()
            })
        });

        document.getElementById("expandAllSearchRes").addEventListener("click", () => {
            console.log("展开全部搜索文档");
            // 在这里实现展开功能
            document.querySelectorAll('.b3-dialog__container .b3-list-item__arrow:not(.b3-list-item__arrow--open)').forEach(arr => {
                arr.parentElement.click()
            })
        });

    }

    // 使用 MutationObserver 监测 DOM 变化
    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            if (mutation.type === 'childList') {
                checkAndAddElements(); // 每次子节点变化时检查
            }
        });
    });

    // 配置观察选项
    const config = { childList: true, subtree: true };

    // 开始观察 body 节点
    observer.observe(document.body, config);

    // 初始检查
    checkAndAddElements();

})()
​