如何配置HelpNDoc默认HTML模板，实现MathJax公式自动加载？

先唠唠你碰到的俩问题为啥会出现：

• 用GUI加自定义JS搞崩TOC：十有八九是GUI把JS插错地方了，和模板自带的TOC渲染逻辑撞车了——比如JS在DOM还没准备好就瞎跑，直接干扰了TOC的生成流程。
• 改完head要手动刷新才显示公式：因为MathJax默认是页面刚加载时解析公式，但你的模板可能是动态加载内容（比如TOC和主题内容不是一次性出来的），MathJax初始化的时候公式还没出现在页面里，自然没法渲染。

下面是靠谱的解决步骤，亲测能替代内置公式编辑器，实现自动加载：

正确配置姿势 #

1. 直接改模板核心文件，别用GUI瞎折腾
   找到topics.pas.html模板，别往head里塞代码，往</body>标签前面加——这时候DOM基本都渲染完了，不会和TOC抢资源：

   <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
   <script>
     // 页面DOM加载完就触发MathJax渲染
     document.addEventListener('DOMContentLoaded', () => {
       MathJax.typesetPromise();
     });
     // 对付动态加载的内容（比如点TOC跳转到新主题）
     document.addEventListener('DOMNodeInserted', (event) => {
       // 假设你的公式带.math类，没有的话直接判断节点里有没有TeX标记也行
       if (event.target.nodeType === 1 && event.target.querySelector('.math')) {
         MathJax.typesetPromise([event.target]);
       }
     });
   </script>
   

   要是你用的是\( ... \)或\[ ... \]这类标准TeX写法，MathJax 3默认就支持，不用额外配置。

2. 非要用GUI加JS的话，这么写
   要是实在不想改模板文件，用GUI加自定义JS的时候，必须把代码包在DOM就绪回调里，别让它乱跑：

   document.addEventListener('DOMContentLoaded', () => {
     const mathjaxScript = document.createElement('script');
     mathjaxScript.src = 'https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js';
     mathjaxScript.onload = () => {
       MathJax.typesetPromise();
     };
     document.body.appendChild(mathjaxScript);
   });
   

   但还是强烈建议直接改模板，GUI注入的位置太容易出问题。

3. 验证效果
   把所有公式改成TeX语法，然后重新构建HTML文档。这时候不管是页面首次加载，还是点TOC切换内容，MathJax都会自动渲染公式，再也不用手动刷新或者点按钮了。

内容的提问来源于stack exchange，提问作者Ilya Zhukov