页内目录Table of Contents
点击了“安装”，又手动滚回“参数”，目录该高亮哪一项？
页内目录列出当前长文的主要章节，并提供指向真实标题的链接。目录层级、目标 ID 与正文应共享一致的结构；若标记当前章节，标记应跟随阅读位置，而不是只记住最后点过哪一个链接。
给这一篇内容画张章节地图。你实际读到哪里，它就说明哪里；不把点过目录当成完成学习。
一本技术手册的目录帮你找到参数、安装和维护，夹在某章的书签则提示当前读到的位置。
类比到这里为止：目录能指路，不能测量理解程度。标题换了或章节移动后，需要同步检查链接和层级，不能只留一张旧清单。
采购商只关心安装限制时直达相应章节；看完再回参数确认型号。手机端目录可自然换行或展开，不通过缩小字号塞进一条狭窄横栏。
让目录和正文共用一份章节信息
- 章节名称
- 与可见标题一致，不生成不存在的栏目。
- 目标标识
- 稳定、唯一，能直接打开。
- 当前章节
- 依据实际滚动位置更新，而不是依据学习成绩。
- 小屏幕
- 允许换行与增加页面长度，不靠压小字体解决。
自动观察不等于自动完成
滚动观察只更新位置提示，不弹窗、不抢焦点、不替用户答题。目录点击后，检查标题是否可见以及下一次键盘操作是否接得上。
下面三个章节由同一份课堂结构生成目录和正文。你可以点击后再手动滚动，比较 URL 中保留的跳转地址与目录标记的当前阅读位置。
继续看项目应用与交付检查
页内目录 在项目中负责什么
- 什么时候用
- 一篇内容有多个独立章节，读者可能查阅其中某一部分时。
- 它解决什么
- 让长页面的结构和当前位置容易理解，支持深链和局部查阅。
- 它不负责什么
- 短文不必把每个小标题都塞进目录；自动高亮不应移动焦点或自动写入学习完成状态。
- 放进真实项目
- 术语详情目录连接专业定义、业务场景、练习和相关资源，并标记当前章节。
页内目录要反映真实标题结构，并随着阅读位置提供方向
一篇术语详情包含四层解释、项目坐标、专业拆解、练习和资源，目录可帮助用户直达当前问题。
- 01
只收录主要、有独立意义的标题。
- 02
让锚点、焦点和固定页头偏移正确。
- 03
内容更新时同步目录并测试深链。
目录对应正文，当前对应位置，读过不等于学会。
容易混淆的地方
页内目录只管本篇章节；网站主导航管全站；面包屑管内容归属；三者可以配合但不是同一套列表。
读者点击目录的安装章节后又手动滚回参数部分。目录高亮和学习记录该怎样变化？
你可以这样告诉 AI Agent
我在处理这件事：术语详情目录连接专业定义、业务场景、练习和相关资源，并标记当前章节。请以“页内目录”为主线，先说明它在这里负责什么、不负责什么；再列出必要输入、建议动作和可验证结果。用外贸独立站的业务语言回答，不确定的信息标为待确认。
内容依据与延伸
本站用原创中文解释把专业概念映射到外贸独立站；定义和机制继续以官方资料为准，业务例子再回到 外贸独立站询盘优化实战 验证。
本站整理说明：原创整理：Web 开发、产品设计、AI 协作与外贸独立站实践