data-spy="scroll"必须加在实际滚动的容器上，如body或带overflow-y:auto的div；data-target需指向导航父容器ID或class；固定导航栏必须设置匹配高度的data-offset。
data-spy="scroll" 必须加在可滚动容器上，通常是 <body>
scrollspy 不会自动生效，核心前提是监听目标得是真正发生滚动的元素。绝大多数情况就是 <body>，但如果你把内容包在某个 <div class="scrollable"> 里并设置了 overflow-y: auto，那 data-spy 就得加在这个 div 上，而不是 body —— 否则完全没反应。
常见错误现象：导航项始终不加 .active 类，控制台也没报错，但滚动毫无响应。
- 确认滚动容器有明确高度和
overflow-y: scroll或auto - 确保该容器内存在带
id的锚点区块（如<div id="section1">） - 如果用了固定顶部导航栏（
.navbar-fixed-top或.sticky-top），必须配data-offset，否则激活位置会偏下
data-target 必须指向导航父容器的 id 或 class，且结构要合规
Scrollspy 靠它定位到哪组导航菜单去更新 .active。值写成 #navbar 就要求导航外层有 id="navbar"；写成 .navbar 就要求外层有 class="navbar" —— 不能写错层级，也不能用后代选择器。
使用场景：你有一套 Bootstrap 导航，结构是 <nav id="main-nav"><ul class="nav"><li><a href="#home">首页</a></li></ul></nav>，那么 data-target 就得是 #main-nav，不是 .nav，更不是 a[href]。
- 导航内部必须是
.nav > li > a结构（或.nav-link在 v4+） -
<a>的href值（如#about）必须严格匹配对应区块的id（如<section id="about">） - 不支持
data-target=".tab-pane"这类动态目标，只认静态 ID/class 定位
data-offset 不是可选项，而是“固定导航栏必填项”
如果你加了 .fixed-top 或 .sticky-top 导航栏，页面滚动时，目标区块的顶部实际出现在视口顶部之前就被判定为“到达”，导致 .active 提前触发。这是因为 Scrollspy 默认以页面顶部为基准计算，而固定导航遮住了上面 56px（Bootstrap 4 默认 navbar 高度）。
解决方法就是告诉它：“别算到顶，算到离顶 56px 的位置再激活”。所以得加 data-offset="56" —— 数值必须和导航栏真实高度一致。
- 查高度方法：
getComputedStyle(document.querySelector('.navbar')).height - 如果用了自定义 navbar 高度（比如 70px），
data-offset也得改成70 - 这个值影响所有锚点的激活时机，设小了会提前激活，设大了会延迟甚至不激活
JavaScript 初始化失败？检查依赖和 DOM 加载时机
Scrollspy 依赖 jQuery（v3.6+）、Popper.js（仅 tooltip/popover 用，Scrollspy 本身不用）和 bootstrap.js 中的 ScrollSpy 构造函数。如果只引入了 CSS 或精简版 JS，它不会工作。
常见错误现象：HTML 属性都写对了，但依然无反应；或者只在刷新后第一次滚动生效，之后失效。
- 确保加载了完整
bootstrap.bundle.js（含 Popper）或至少bootstrap.js + jquery.js - 初始化代码必须等 DOM 加载完再执行，例如用
$(function(){...})或DOMContentLoaded事件 - 如果手动调用 JS API（如
new bootstrap.ScrollSpy(...)），target 元素必须已存在于 DOM 中
data-target 指向非父容器、data-offset 忘设或设错。尤其当页面有多个滚动区域或嵌套导航时，每个监听实例都要独立配置，不能复用同一组属性。 
