导读

在网站开发过程当中，尤其是前端的一些交互效果，我们会碰到有页面内锚点定位及跳转的需求。这个效果就象书签一样，类似word文档中的目录跳转。实现这种功能我们通常想到的是锚点跳转，那么除此以外还有没有其它方法呢?今天做网站小编和大伙一同来探讨一下...

通常我们说的页面内的内容之间的跳转，一般有以下几中实现方法：

1、锚点定位及跳转

这个比较简单，就是在标签中的href属性指向DIV的具体ID即可。我们通过html代码来看一下。

这个方法，在鼠标点击后网址会有所变化，即网址后面会带上#div1这种后缀标识。

2、通过Jquery 的animate方法来作页面滚动跳转。如以下代码：

注意：运行上面的脚本的之前，先将为锚点增加相应的id，同时去掉href属性。

$("html, body")可以替换为响应的div，如果不起作用，试着给该div增加overflow：scroll属性。

另外，脚本可以进一步优化，自己来试试

这样做的好处是：URL地址不会变，同时点击锚点时会自动响应scroll事件，不需要重新绑定。

缺点是：如果页面复杂的话，偏移值可能会发生变化需要算法辅助。

3、使用js的srollIntoView方法，直接用:

这种方法的好处，是URL不会变，同时能够响应相应的scroll事件，不需要算法什么的。

当然还可以使用在js事件中通过window.location.hash="divId"跳转，但地址也会发生变化，感觉跟第一种方法没区别，甚至更麻烦。

总结：

以上列出的几点关于页面中锚点定位及跳转的方法有些是网址会产生变化的，使用JQUERY的animate方法就不会使用网址产生变化，当然你可能也能找到一些写好的Jquery插件来做。做网站小编所说的只是一些最基础的解决办法，期待你的留言分享...