1.通过链接跳转到指定id的位置:
<body>
<a href="#a">跳转到指定位置</a>
<ul>
<li>1</li>
<li>1</li>
<li id="a" style="color: red;">2</li>
<li>1</li>
<li>1</li>
</ul>
</body>
2.只有对a标签有效的方法,设置name属性:
(在chrome浏览器中,使用第二种方法跳转到目标位置时,会给目标添加上一个浅蓝色边框, 利于寻找)
<body>
<a href="#a">跳转到指定位置</a>
<ul>
<p>练习</p>
<p>练习</p>
<a name="a" href="#" style="text-decoration: none; color: red;">练习</a>
<!--仅对a标签可以-->
<p>练习</p>
<p>练习</p>
<p>练习</p>
</ul>
</body>
3.利用Element.scrolIIntoView()方法,Element.scrolIIntoView() 方法让当前的元素滚动到浏览器窗口的可视区域内;
<body>
<ul>
<li class="" onclick="javascript:document.getElementById('here').scrollIntoView()">寻找红色的here</li>
<li>herr</li>
<li>herr</li>
<li>herr</li>
<li style="color: red;" id="here">herr</li>
<li>herr</li>
</ul>
</body>