HTML怎么创建文章目录锚点_HTML h2-h3自动生成导航【方法】

HTML不支持自动生成目录，需手动为h2/h3添加符合规范的id（小写、连字符、非数字开头、唯一），再用href链接；JS动态生成TOC须等DOM加载、安全转义文本、避免重排；CSS :target仅能高亮目标元素，:has()支持不稳，高亮导航项仍需JS。HTML 原生不支持自动创建文章目录（TOC），所有“自动生成”都得靠 JavaScript 或构建时处理；纯 HTML 只能手动写 <a href="#xxx"> 和 id="xxx" 配对锚点。怎么给 h2/h3 加 id 并手动链接浏览器识别锚点只看 id 属性，和标签名无关。但为了语义清晰、方便 JS 提取，惯例用 h2 做一级标题、h3 做二级标题，并为每个加唯一 id。常见错误：直接复制中文标题当 id，比如 <h2 id="用户登录流程"> —— 这在部分旧浏览器或 CSS 选择器里会出问题，且空格、标点会导致链接失效。用小写字母 + 连字符替换空格和标点，例如 "用户登录流程" → id="user-login-flow"避免数字开头，如 id="1-intro" 不推荐，改用 id="intro-1"确保每个 id 全局唯一，重复会导致 <a href="#xxx"> 总跳到第一个匹配项示例：立即学习“前端免费学习笔记（深入）”； Vozo Vozo是一款强大的AI视频编辑工具，可以帮助用户轻松重写、配音和编辑视频。