页面内跳转到指定div的几种方法（锚点、hash、animate、scrollIntoView）
由于最近有回到顶部、根据nav定位到指定div和定位到输入错误的输入框的需求，所以在此分析此类需求可能的解决方案
用a标签的href属性
这是比较常用的一种方法
href。这是一个必需属性为锚定义一个超文本链接来源。这表示链接目标的URL或URL片段。URL片段是由一个hash符号（＃），它指定一个内部目标在当前文档中的位置（ID）开头的名字。
查资料的时候发现html5中a标签新增download属性，很强大但是兼容性还不够
缺点：点击跳转后url发生变化，页面刷新后可能有问题
通过window.location.hash
此方法原理与通过a标签的href属性相同，都是根据锚点来实现定位
hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分）。
css standard
JAMES
PAUL
HARDEN
- JAMES
- PAUL
- HARDEN
缺点：点击跳转后url发生变化，页面刷新后可能有问题
用scrollTop属性实现
根据元素的scrollTop属性实现，这是之前很常用的一种实现方式，此处不细说。实例借助Jquery实现
css standard
JAMES
PAUL
HARDEN
- JAMES
- PAUL
- HARDEN
缺点：如果页面复杂的话，偏移值可能会发生变化需要算法实现，并且脱离Jquery实现代码量会比较大，但是好处就是兼容性好，可行性高
用scrollIntoView实现
先看看用scrollIntoView实现的兼容性
兼容性还不错，关键是实现特别简单，不需要自己计算（偷懒神器）
- 语法
element.scrollIntoView(); - 参数
// element.scrollIntoView(Boolean) Boolean型参数
1.如果为true，元素的顶端将和其所在滚动区的可视区域的顶端对齐。
2.如果为false，元素的底端将和其所在滚动区的可视区域的底端对齐。
// element.scrollIntoView(Obj) 型参数
{
behavior: "auto" | "instant" | "smooth",
block: "start" | "end",
}
// block与Boolean型参数作用相同，behavior参数是决定页面是如何滚动smooth有动画。
这个方法用的时候直接调用就ok，document.getElementById("divId").scrollIntoView();
scrollIntoView demo1
click
当然，scrollIntoView还接受一个参数，更具体的细节可以参考MDN上的介绍
本文csdn地址
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/3370/viewspace-2813981/ ，如需转载，请注明出处，否则将追究法律责任。
