Bootstrap 的滚动监听（Scrollspy）插件是一个非常实用的组件，它可以自动更新导航菜单项的激活状态，根据用户滚动页面的位置来高亮显示导航中的对应项。这使得用户可以直观地看到他们在页面上所处的位置。
如何使用 Scrollspy
通过 Data Attributes
要使用 Scrollspy，你可以在 HTML 中使用 data attributes 来激活它。通常，你会在 <body> 标签上添加 data-spy="scroll" 属性，并设置 data-target 属性为导航菜单的 ID 或类名。
<body data-spy="scroll" data-target="#navbar-example">
<div id="navbar-example">
<ul class="nav nav-tabs" role="tablist">
<!-- 导航项 -->
</ul>
</div>
<!-- 页面内容 -->
</body>
通过 JavaScript
你也可以通过 JavaScript 来初始化 Scrollspy。首先，确保你的页面已经加载了 Bootstrap 的 JavaScript 文件。然后，你可以使用以下代码来初始化 Scrollspy：
$('body').scrollspy({
target: '#navbar-example' })
选项
Scrollspy 有一些可用的选项，例如 offset，它允许你设置从顶部开始的偏移量，默认值为 10 像素。
<body data-spy="scroll" data-target=".navbar-example" data-offset="0">
方法
如果你在页面上动态添加或删除了元素，可能需要刷新 Scrollspy 来重新计算。这时，你可以使用 .refresh() 方法：
