求 js 代码，在使用“始终定位打开的文档”功能时，只展开当前文档的文档树，自动关闭（不展开）其它无关的文档树。例如：
有笔记本 A，内有文档 A1，子文档 A2、子子文档 A3。
有笔记本 B，内有文档 B1，子文档 B2、子子文档 B3。
已将文档 A2、B2 打开，显示在上方页签栏中。
启用“始终定位打开的文档”功能。
点击 A2 页签，左侧文档树自动展开，并定位到 A-A1-A2；A3 列表不展开
点击 B2 页签，左侧文档树自动展开，定位到 B-B1-B2；同时关闭 A-A1-A2 文档树的展开状态，恢复到笔记本 A。也就是仅保留当前活动页签对应的文档树是展开状态，其它文档树分支全部关闭，包括当前活动文档的子文档树。
思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。
融合块、大纲和双向链接，重构你的思维。
提问之前请先看《提问的智慧》，好的问题比好的答案更有价值。
时隔 1 个多月，你解决了吗？相见即是有缘，看到此贴感觉有些思路，就尝试写了下，实现了这个功能。由于刚接触思源，对思源 api 还不是很了解，所以选择用 js 代码片段实现，纯原生 js 实现，方法比较笨，勉强能用。
不足之处也请论坛里的大佬们多多批评指正！
效果如下：
完整代码如下：
// 等待标签页容器渲染完成后开始监听
whenElementExist('.layout__center').then(async element => {
// 等待笔记列表加载完毕
await sleep(40);
// 监听页签切换事件
observeTabChanged(element, (tab) => {
// 折叠所有笔记，然后定位当前笔记
collapseAllBooksThenFocusCurrentBook(element, tab);
});
});
// 折叠所有笔记，然后定位当前笔记
async function collapseAllBooksThenFocusCurrentBook(element, tab) {
// 等待激活文档加载完毕
await whenElementExist(()=>{
const content = element.querySelector('.layout-tab-container [data-id="'+tab.getAttribute("data-id")+'"]');
return content && content.getAttribute("data-loading") === "finished";
});
// 折叠所有笔记
document.querySelectorAll("ul.b3-list[data-url]").forEach(async book => {
const bookName = tab.getAttribute("aria-label")?.split('/')[0];
if(bookName) {
// 如果在本笔记中则不再折叠
const bookText = book.querySelector('li[data-type="navigation-root"] span.b3-list-item__text')?.innerText;
if(bookText === bookName) {
return;
}
}
// 折叠笔记
const bookArrowBtn = book.querySelector('li[data-type="navigation-root"] span.b3-list-item__toggle');
if (bookArrowBtn && bookArrowBtn.firstElementChild.classList.contains("b3-list-item__arrow--open")) {
bookArrowBtn.click();
}
});
// 定位当前笔记
document.querySelector(".layout-tab-container .block__icons span[data-type=focus]")?.click();
}
// 监听页签切换事件
function observeTabChanged(parentNode, callback) {
// 创建一个回调函数来处理观察到的变化
const observerCallback = function(mutationsList, observer) {
// 用常规方式遍历 mutationsList 中的每一个 mutation
for (let mutation of mutationsList) {
// 属性被修改
if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
const element = mutation.target;
if (element.tagName.toLowerCase() === 'li' && element.getAttribute('data-type') === 'tab-header' && element.classList.contains('item--focus')) {
if(typeof callback === 'function') callback(element);
}
}
// 如果有新的子节点被添加
if (mutation.type === 'childList') {
mutation.addedNodes.forEach(node => {
if (node.nodeType === Node.ELEMENT_NODE && node.tagName.toLowerCase() === 'li') {
if (node.getAttribute('data-type') === 'tab-header' && node.classList.contains('item--focus')) {
if(typeof callback === 'function') callback(node);
}
}
});
}
}
};
// 创建一个观察器实例并传入回调函数
const observer = new MutationObserver(observerCallback);
// 配置观察器：传递一个对象来指定观察器的行为
const config = { attributes: true, attributeFilter: ['class'], childList: true, subtree: true };
// 开始观察目标节点
observer.observe(parentNode, config);
// 返回一个函数，用于停止观察
return function stopObserving() {
observer.disconnect();
};
}
// 延迟执行
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
// 等待元素渲染完成后执行
function whenElementExist(selector) {
return new Promise(resolve => {
const checkForElement = () => {
let element = null;
if (typeof selector === 'function') {
element = selector();
} else {
element = document.querySelector(selector);
}
if (element) {
resolve(element);
} else {
requestAnimationFrame(checkForElement);
}
};
checkForElement();
});
}
使用方法：
设置 》外观 》代码片段 》js 中新增加代码片段，然后把上面的代码粘贴过去即可。
房星网，我们不和没有钱的程序员谈理想，我们要让程序员又有理想又有钱。我们有雄厚的房地产行业线下资源，遍布昆明全城的 100 家门店、四千地产经纪人是我们坚实的后盾。
Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言，它只是一个框架和一组服务，用于通过插件组件构建开发环境。
Webswing 是一个能将任何 Swing 应用通过纯 HTML5 运行在浏览器中的 Web 服务器，详细介绍请看 将 Java Swing 应用变成 Web 应用 。
思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。
融合块、大纲和双向链接，重构你的思维。
Dubbo 是一个分布式服务框架，致力于提供高性能和透明化的 RPC 远程服务调用方案，是 [阿里巴巴] SOA 服务化治理方案的核心框架，每天为 2,000+ 个服务提供 3,000,000,000+ 次访问量支持，并被广泛应用于阿里巴巴集团的各成员站点。
黑曜石是一款强大的知识库工具，支持本地 Markdown 文件编辑，支持双向链接和关系图。
A second brain, for you, forever.
GitBook 使您的团队可以轻松编写和维护高质量的文档。 分享知识，提高团队的工作效率，让用户满意。
WiFiDog 是一套开源的无线热点认证管理工具，主要功能包括：位置相关的内容递送；用户认证和授权；集中式网络监控。
代码片段分为 CSS 与 JS 两种代码，添加在 [设置 - 外观 - 代码片段] 中，这些代码会在思源笔记加载时自动执行，用于改善笔记的样式或功能。
用户在该标签下分享代码片段时需在帖子标题前添加 [css] 或 [js] 用于区分代码片段类型。
Flutter 是谷歌的移动 UI 框架，可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作，它正在被越来越多的开发者和组织使用，并且 Flutter 是完全免费、开源的。
ReactiveX 是一个专注于异步编程与控制可观察数据（或者事件）流的 API。它组合了观察者模式，迭代器模式和函数式编程的优秀思想。
互联网运维工作，以服务为中心，以稳定、安全、高效为三个基本点，确保公司的互联网业务能够 7×24 小时为用户提供高质量的服务。
哪里都缺人，哪里都不缺人。
Lute 是一款结构化的 Markdown 引擎，支持 Go 和 JavaScript。
SSL（Secure Sockets Layer 安全套接层），及其继任者传输层安全（Transport Layer Security，TLS）是为网络通信提供安全及数据完整性的一种安全协议。TLS 与 SSL 在传输层对网络连接进行加密。
TensorFlow 是一个采用数据流图（data flow graphs），用于数值计算的开源软件库。节点（Nodes）在图中表示数学操作，图中的线（edges）则表示在节点间相互联系的多维数据数组，即张量（tensor）。
Ubuntu（友帮拓、优般图、乌班图）是一个以桌面应用为主的 Linux 操作系统，其名称来自非洲南部祖鲁语或豪萨语的“ubuntu”一词，意思是“人性”、“我的存在是因为大家的存在”，是非洲传统的一种价值观，类似华人社会的“仁爱”思想。Ubuntu 的目标在于为一般用户提供一个最新的、同时又相当稳定的主要由自由软件构建而成的操作系统。
Love2D 是一个开源的， 跨平台的 2D 游戏引擎。使用纯 Lua 脚本来进行游戏开发。目前支持的平台有 Windows, Mac OS X, Linux, Android 和 iOS。
Laravel 是一套简洁、优雅的 PHP Web 开发框架。它采用 MVC 设计，是一款崇尚开发效率的全栈框架。
设计模式（Design pattern）代表了最佳的实践，通常被有经验的面向对象的软件开发人员所采用。设计模式是软件开发人员在软件开发过程中面临的一般问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的。
C 语言是一门通用计算机编程语言，应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。
Java 是一种可以撰写跨平台应用软件的面向对象的程序设计语言，是由 Sun Microsystems 公司于 1995 年 5 月推出的。Java 技术具有卓越的通用性、高效性、平台移植性和安全性。
Telegram 是一个非盈利性、基于云端的即时消息服务。它提供了支持各大操作系统平台的开源的客户端，也提供了很多强大的 APIs 给开发者创建自己的客户端和机器人。
据说 99% 的性能瓶颈都在数据库。
Scala 是一门多范式的编程语言，集成面向对象编程和函数式编程的各种特性。
CentOS（Community Enterprise Operating System）是 Linux 发行版之一，它是来自于 Red Hat Enterprise Linux 依照开放源代码规定释出的源代码所编译而成。由于出自同样的源代码，因此有些要求高度稳定的服务器以 CentOS 替代商业版的 Red Hat Enterprise Linux 使用。两者的不同在于 CentOS 并不包含封闭源代码软件。
知乎是网络问答社区，连接各行各业的用户。用户分享着彼此的知识、经验和见解，为中文互联网源源不断地提供多种多样的信息。
