Простой способ прокрутки страницы к элементу без изменения URL-адреса

Исходные условия

Для прокрутки страницы к элементу необходимо, во-первых, добавить элементу уникальный идентификатор:

<div id="anchor">...</div>

Во-вторых, указать этот идентификатор в ссылке для прокрутки страницы к элементу:

<a href="#anchor">Перейти к элементу</a>

Для того, чтобы страница прокручивалась плавно, а не перепрыгивала к элементу, в стили можно добавить свойство:

html {
  scroll-behavior: smooth;
}

Теперь, при клике по ссылке, страница плавно прокрутится к элементу, но, при этом, в адресной строке к текущему URL-адресу страницы добавится его идентификатор:

https://example.com/#anchor

Такое поведение иногда является нежелательным.

Решение

Для прокрутки страницы к элементу без изменения URL-адреса необходимо добавить на страницу несколько строк JavaScript-кода:

<script type="module">
  const links = document.querySelectorAll("a[href^='#']");
  links.forEach((link) => {
    const href = link.getAttribute("href");
    const target = href === "#" ? "body" : href;
    link.addEventListener("click", (event) => {
      event.preventDefault();
      document.querySelector(target).scrollIntoView({ behavior: "smooth" });
    });
  });
</script>

При этом, вносить изменения в исходный HTML-код не потребуется.