[Bug]: 前端渲染 Mermaid、MathJax、ABCJS 之后，TOC 显示错位

[trantuan-20048607]

使用的 Butterfly 版本？ | What version of Butterfly are you using?

5.5.4

是否修改過主題文件？ | Has the theme files been modified?

是 (Yes)

使用的瀏覽器？ | What browser are you using?

Chrome

使用的系統？ | What operating system are you using?

Windows

依賴插件 | Package dependencies information

Legend: production dependency, optional only, dev only

blog@0.0.0 /home/trantuan/blog (PRIVATE)
│
│   dependencies:
├── @fontsource/noto-music@5.2.8
├── @fontsource/noto-sans@5.2.10
├── @fontsource/noto-serif@5.2.9
├── @fontsource/source-code-pro@5.2.7
├── @goodware/task-queue@3.0.1
├── @mathjax/mathjax-bbm-font-extension@4.1.1
├── @mathjax/mathjax-bboldx-font-extension@4.1.1
├── @mathjax/mathjax-dsfont-font-extension@4.1.1
├── @mathjax/mathjax-euler-font-extension@4.1.1
├── @mathjax/mathjax-mhchem-font-extension@4.1.1
├── @mathjax/mathjax-newcm-font@4.1.1
├── @mathjax/src@4.1.1
├── buffer@6.0.3
├── gulp@5.0.1
├── gulp-clean-css@4.3.0
├── gulp-html-minifier-terser@8.0.0
├── gulp-htmlclean@2.7.22
├── gulp-imagemin@9.2.0
├── gulp-scale-images@3.0.3
├── gulp-terser@2.1.0
├── gulp-uglify@3.0.2
├── hexo@8.1.1
├── hexo-butterfly-extjs@1.5.5
├── hexo-generator-archive@2.0.0
├── hexo-generator-category@2.0.0
├── hexo-generator-index@4.0.0
├── hexo-generator-searchdb@1.5.0
├── hexo-generator-tag@2.0.0
├── hexo-renderer-marked@7.0.1
├── hexo-renderer-pug@3.0.0
├── hexo-renderer-stylus@3.0.1
├── hexo-server@3.0.0
├── hexo-theme-butterfly@5.5.4
├── hexo-util@4.0.0
├── hexo-wordcount@6.0.1
├── jsdom@29.0.2
├── mathjax@4.1.1
├── memfs@4.57.1
├── moment-timezone@0.6.1
├── node-snackbar@0.1.16
├── patch-package@8.0.1
├── tar-fs@3.1.2
└── through2@4.0.2

問題描述 | Describe the bug

页面中存在大量 Mermaid、MathJax、ABCJS 元素，会导致 TOC 显示当前位置向下偏移。推测原因是这些功能执行前端渲染之后，main.js没有及时更新标题位置缓存，导致目录显示错位。

对source/js/main.js进行以下修改，临时禁用标题 headerList 优化之后，问题消失，看看有什么更好的解决办法。

@@ -556,25 +554,18 @@ document.addEventListener('DOMContentLoaded', () => {
     const $articleList = $article.querySelectorAll('h1,h2,h3,h4,h5,h6')
     let detectItem = ''
 
-    // Optimization: Cache header positions
-    let headerList = []
-    const updateHeaderPositions = () => {
-      headerList = Array.from($articleList).map(ele => ({
-        ele,
-        top: btf.getEleTop(ele),
-        id: ele.id
-      }))
-    }
-
-    updateHeaderPositions()
-    btf.addEventListenerPjax(window, 'resize', btf.throttle(updateHeaderPositions, 200))
-
     const findHeadPosition = top => {
       if (top === 0) return false
 
       let currentId = ''
       let currentIndex = ''
 
+      let headerList = Array.from($articleList).map(ele => ({
+        ele,
+        top: btf.getEleTop(ele),
+        id: ele.id
+      }))
+
       for (let i = 0; i < headerList.length; i++) {
         const item = headerList[i]
         if (top > item.top - 80) {

出現問題的網站 | Website with the issue

无