最终实现的 JS 代码片段：
/** * 在顶栏添加按钮，快捷打开代码片段界面 JS片段 * 参考 https://ld246.com/article/1674026309504 修改，同时感谢 [Undii](https://ld246.com/member/Undii) 提供 帮助 * 为顶栏增加代码片段按钮，点击后创建快捷键按下事件 * 挂件模式支持点击日记列出笔记本。 https://ld246.com/article/1674026309504 */ // 设置是否添加对应按钮 let g_addSnippets = true;// 设置 // 插入按钮 // 插入日历笔记本选择挂件 // 参考: https://ld246.com/article/1662969146166 原作者: BryceAndJuly // 参考: https://github.com/svchord/Rem-Craft 原作者: Seven Chor function addSnippets() { let barMode = document.getElementById("barMode"); barMode.insertAdjacentHTML( "afterend", '<div id="barSnippets_simulate" class="toolbar__item ariaLabel" aria-label="代码片段/Snippets"></div>' ); let settingBtn = document.getElementById("barSnippets_simulate"); settingBtn.innerHTML = `<svg><use xlink:href="#iconCode"></use></svg>`; settingBtn.addEventListener( "click", function (e) { dispatchKeyEvent("config"); setTimeout(function() { // 找到包含 data-name="appearance" 的 <li> 元素 var element = document.querySelector('li[data-name="appearance"]'); // 创建一个点击事件 var event = new MouseEvent('click', { bubbles: true, cancelable: true, view: window }); // 触发点击事件 element.dispatchEvent(event); }, 100); // 1000毫秒 = 1秒 setTimeout(function() { // 获取按钮元素 var button = document.getElementById('codeSnippet'); // 创建一个新的点击事件 var clickEvent = new MouseEvent('click', { view: window, bubbles: true, cancelable: true }); // 触发按钮的点击事件 button.dispatchEvent(clickEvent); }, 200); // 1000毫秒 = 1秒 } ); } /** * */ function dispatchKeyEvent(functionName) { let keyInit = parseHotKeyStr(window.top.siyuan.config.keymap.general[functionName].custom); keyInit["bubbles"] = true; let keydownEvent = new KeyboardEvent('keydown', keyInit); document.getElementsByTagName("body")[0].dispatchEvent(keydownEvent); let keyUpEvent = new KeyboardEvent('keyup', keyInit); document.getElementsByTagName("body")[0].dispatchEvent(keyUpEvent); } /** * * @param {*} hotkeyStr 思源hotkey格式 Refer: https://github.com/siyuan-note/siyuan/blob/d0f011b1a5b12e5546421f8bd442606bf0b5ad86/app/src/protyle/util/hotKey.ts#L4 * @returns KeyboardEventInit Refer: https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/KeyboardEvent */ function parseHotKeyStr(hotkeyStr) { let result = { ctrlKey: false, altKey: false, metaKey: false, shiftKey: false, key: 'A', keyCode: 0 } if (hotkeyStr == "" || hotkeyStr == undefined || hotkeyStr == null) { console.error("解析快捷键设置失败", hotkeyStr); throw new Error("解析快捷键设置失败"); } let onlyKey = hotkeyStr; if (hotkeyStr.indexOf("⌘") != -1) { result.ctrlKey = true; onlyKey = onlyKey.replace("⌘", ""); } if (hotkeyStr.indexOf("⌥") != -1) { result.altKey = true; onlyKey = onlyKey.replace("⌥", ""); } if (hotkeyStr.indexOf("⇧") != -1) { result.shiftKey = true; onlyKey = onlyKey.replace("⇧", ""); } // 未处理 windows btn （MetaKey） result.key = onlyKey; // 在https://github.com/siyuan-note/siyuan/commit/70acd57c4b4701b973a8ca93fadf6c003b24c789#diff-558f9f531a326d2fd53151e3fc250ac4bd545452ba782b0c7c18765a37a4e2cc // 更改中，思源改为使用keyCode判断快捷键按下事件，这里进行了对应的转换 // 另请参考该提交中涉及的文件 result.keyCode = keyCodeList[result.key]; console.assert(result.keyCode != undefined, `keyCode转换错误,key为${result.key}`); switch (result.key) { case "→": { result.key = "ArrowRight"; break; } case "←": { result.key = "ArrowLeft"; break; } case "↑": { result.key = "ArrowUp"; break; } case "↓": { result.key = "ArrowDown"; break; } case "⌦": { result.key = "Delete"; break; } case "⌫": { result.key = "Backspace"; break; } case "↩": { result.key = "Enter"; break; } } return result; } if (g_addSnippets) addSnippets(); const keyCodeList = { "⌫": 8, "⇥": 9, "↩": 13, "⇧": 16, "⌘": 91, "⌥": 18, "Pause": 19, "CapsLock": 20, "Escape": 27, " ": 32, "PageUp": 33, "PageDown": 34, "End": 35, "Home": 36, "←": 37, "↑": 38, "→": 39, "↓": 40, "PrintScreen": 44, "Insert": 45, "⌦": 46, "0": 48, "1": 49, "2": 50, "3": 51, "4": 52, "5": 53, "6": 54, "7": 55, "8": 56, "9": 57, "A": 65, "B": 66, "C": 67, "D": 68, "E": 69, "F": 70, "G": 71, "H": 72, "I": 73, "J": 74, "K": 75, "L": 76, "M": 77, "N": 78, "O": 79, "P": 80, "Q": 81, "R": 82, "S": 83, "T": 84, "U": 85, "V": 86, "W": 87, "X": 88, "Y": 89, "Z": 90, "ContextMenu": 93, "MyComputer": 182, "MyCalculator": 183, ";": 186, "=": 187, ",": 188, "-": 189, ".": 190, "/": 191, "`": 192, "[": 219, "\\": 220, "]": 221, "'": 222, "*": 106, "+": 107, "-": 109, ".": 110, "/": 111, "F1": 112, "F2": 113, "F3": 114, "F4": 115, "F5": 116, "F6": 117, "F7": 118, "F8": 119, "F9": 120, "F10": 121, "F11": 122, "F12": 123, "NumLock": 144, "ScrollLock": 145 };
原贴：
看到个 帖子 ，添加按钮应该是这样：
function addSnippets() { let barMode = document.getElementById("barMode"); barMode.insertAdjacentHTML( "afterend", '<div id="barSnippets_simulate" class="toolbar__item ariaLabel" aria-label="代码片段/Snippets" ></div>' ); let settingBtn = document.getElementById("barSnippets_simulate"); settingBtn.innerHTML = `<svg><use xlink:href="#iconCode"></use></svg>`; settingBtn.addEventListener("click", function() { openSnippets(); }, false); } function openSnippets() { } addSnippets();
但是我不知道怎么打开代码片段界面