scrollTop и пример с кнопкой прокрутки страницы вверх.

Для реализации прокрутки страницы вверх на чистом JS используется метод scrollTop. Ниже рассмотрен пример прокрутки страницы вверх по нажатию на кнопку.

html код для кнопки прокрутки страницы вверх:

// некая кнопка со стилями, которая вызывает функцию topFunction() при клике
<div class="btnToTop" id="js-btnToTop" title="Наверх" onclick="topFunction()"></div>

<style>
 .btnToTop{
    position: absolute;
    bottom: 6rem;
    right: 6rem;
    width: 6rem;
    height: 6rem;
    background: red;
    cursor: pointer;
  }
</style>

Чтобы проверить, видит ли браузер клик по кнопке, можно добавить вывод события в консоль:

<div class="btnToTop" id="js-btnToTop" title="Наверх" onclick="console.log("Click!");topFunction()"></div>

По умолчанию Scroll используется на элементах body и html, но в некоторых случаях, из-за особенностей верстки страницы, элемент к которому применяется scroll изменяется. В этом случае надо выяснить на каком элементе установлен нужный overflow: scroll или overflow: auto;

ScrollToTop по умолчанию:

function topFunction() {
  document.body.scrollTop = 0; // For Safari
  document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
}

Такой код не будет работать, если вы изменили прокручиваемый элемент с body, на какой-то другой. 

ScrollToTop , если элемент изменен:

// Находим элемент который изменяет позицию относительно верха:
let Element = document.getElementById("someElementID");
function topFunction() {
  Element.scrollTop = 0;
}

Обратите внимание, что при использовании чистого JS элемент должен быть получен с помощью ID. 

Что бы понять, правильно ли вы выбрали прокручивающийся элемент, можно проверить его позицию с помощью консоли, добавив в функцию topFunction запись о позиции элемента:

// В этом случае в консоли будет появляться текущая позиция элемента.
// Если после прокрутки страницы и клика на кнопку в консоли написано 0 или undefined,
// значит элемент указан не верно
function topFunction() {
  console.log(Element.scrollTop);
}

Еще 1 вариант вычисления позиции относительно верха — повесить функцию на событие прокрутки (если она не срабатывает, элемент выбран не правильно):

// создаем функцию
function scrollFunction() {
     console.log(document.body.scrollTop);
}

// вызываем при скроллинге
document.body.onscroll = function() {scrollFunction()};


Для того, чтобы кнопка не висела на экране всегда, подправим код scrollFunction (обратите внимание, что код указан для значений скроллинга по умолчанию. Если у вас скрол установлен не на body, ищите соответствующую запись выше):

// Получаем ID кнопки
let toTopBtn = document.getElementById("js-btnToTop");

// создаем функцию
function scrollFunction() {
  // Если документ прокручен более чем на 20 px сверху то, показываем кнопку, если нет - прячем
  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
    toTopBtn.style.display = "block";
  } else {
    toTopBtn.style.display = "none";
  }
}

// вызываем при скроллинге
document.body.onscroll = function() {scrollFunction()};