項目中經(jīng)常會遇到觸發(fā)事件頁面自動滾動到某一位置的情況掸屡，一般可以用游標(biāo)實現(xiàn)，但也有另一種簡單的實現(xiàn)思路顶考，利用element.getBoundingClientRect()和window.scrollTo()
由于是JS控制滾動條醉顽，所以我們可以輕松添加動畫效果，代碼如下
function animateScroll(element,speed) {
let rect=element.getBoundingClientRect();
//獲取元素相對窗口的top值蜀撑，此處應(yīng)加上窗口本身的偏移
let top=window.pageYOffset+rect.top;
let currentTop=0;
let requestId;
//采用requestAnimationFrame挤巡，平滑動畫
function step(timestamp) {
currentTop+=speed;
if(currentTop<=top){
window.scrollTo(0,currentTop);
requestId=window.requestAnimationFrame(step);
}else{
window.cancelAnimationFrame(requestId);
}
}
window.requestAnimationFrame(step);
}
