javascript - 锚元素在第一次单击时无法正确滚动，但在第二次尝试时滚动正常

Question

我有一个锚可以平滑地滚动到我想要的部分。当我第一次点击我的锚点时，它会顺利进入我的部分，但问题是它添加了一个我不知道为什么首先存在的偏移量，当我再次点击它时，它会准确地到达我想要的位置抵消。

这是我的html：

<a class="move-to-section-sticky" href="#comments-area"> Comments</a>


<div id="comments-area"></div>

这是我的js：

const seeBonus = document.querySelectorAll(".move-to-section-sticky");

seeBonus.forEach(anchor => {
    anchor.addEventListener('click', function (e) {
        e.preventDefault();

        document.querySelector(this.getAttribute('href')).scrollIntoView({
            behavior: 'smooth'
        });
    });
});

标签： javascripthtmlanchor