一、通过data属性
根据情况，给需要监视的页面元素添加 data-spy="scroll" 一般是 body 元素，并且通过 data-target 属性指定目标：
<body data-spy="scroll" data-target=".navbar">...</body>
二、通过Javascript语句
$('#navbar').scrollspy()
举一个例子，如下：
监控的导航部分 HTML 代码：
<div class="bs-docs-sidebar">
<ul class="nav">
<li><a href="#one">hello Bootstrp 3</a></li>
<li><a href="#two">hello jQuery</a></li>
<li><a href="#three">hello ScrollSpy</a></li>
</ul>
</div>
导航相对应的内容部分代码：
<div>
<h2 id="one">This is one.</h2>
<p>......</p>
<h2 id="two">This is two.</h2>
<p>......</p>
<h2 id="three">This is three.</h2>
<p>......</p>
</div>
上述代码里，我们点击导航部分的锚链接可以直接跳转到相应的内容部分，这是这最基本的 HTML 结构。最重要的，导航代码中 ul 含有一个 CSS 类 .nav，它是必需的，没有的话就会导致插件无效果。
应用第一个方法，在 body 元素添加相关属性：
<body data-spy="scroll" data-target=".bs-docs-sidebar">
data-target 属性指向的是 class 为 bs-docs-sidebar 的 div 块。
第二种办法，使用 JavaScript：
$(function(){
$('.bs-docs-sidebar').scrollspy();
})
Bootstrap 文档推荐第一种方法，因为不用任何的 JavaScript 语句即可实现 ScrollSpy 效果。
