JS 锚点定位滚动带动画，有如下的方式可以实现：
// id 为选择器写法 如 '#xxx'
document.querySelector(id).scrollIntoView({ behavior: 'smooth' }); // 有兼容性问题
但是上面这种方式会有兼容性问题，在某些浏览器上滚动的距离不一样，就会造成偏差，所以手动写了一个：
/**
* 界面变速或匀速滚动，只关注前四个参数，后面的参数为减少变量定义而存在
* @param {Number} initTop 当前浏览器的滚动的高度，可使用 document.documentElement.scrollTop 获取
* @param {Number} offset 需要移动的距离
* @param {Number} down 是否是向下滚动是则为 1，向上为 -1
* @param {Bool} a 是否变速运动
* @param {Number} moved 总移动距离
* @param {Number} i 每次移动的距离，通过计算而来
* @param {Number} m 实际移动的距离，带有方向，正数为向下，负数为向上，为减少变量定义而存在，无需关注
*/
function anim(initTop, offset, down, a = false, moved = 0, i = 1, m = 0) {
setTimeout(() => {
i = a ? moved < offset - 128 ? i * 1.02 : i / 1.6 : 16;
i = i < 1 ? 1 : i;
i = i > 32 ? 32 : i;
moved += i;
m = i * down;
if (moved > offset) m = moved - offset;
document.documentElement.scrollTop = initTop + m;
if (moved < offset) {
anim(initTop + m, offset, down, a, moved, i);
}
}, 1);
}
使用方式：
在需要使用滚动并带有动画时，获取到初始浏览器的滚动高度（第一个参数，可使用document.documentElement.scrollTop获取），然后把移动的距离（第二个参数，可使用document.querySelector(id).offsetTop获取某锚点的高度）、方向（第三个参数）和是否变速滚动（第四个参数）传入即可
