Вернитесь к началу прокручиваемого div

<div id="containerDiv"></div>

#containerDiv {
  position: absolute;
  top: 0px;
  width: 400px;
  height: 100%;
  padding: 5px;
  font-size: .875em;
  overflow-y: scroll;
}

document.getElementById("containerDiv").innerHTML = variableLongText;

Как в следующий раз вернуть позицию прокрутки в верхнюю часть контейнера div?

var myDiv = document.getElementById('containerDiv');
myDiv.innerHTML = variableLongText;
myDiv.scrollTop = 0;

Смотрите scrollTopатрибут.

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

$("#containerDiv").animate({ scrollTop: 0 }, "fast");

Я попробовал существующие ответы на этот вопрос, и ни один из них не помог мне в Chrome. Что работало, было немного иначе:

$('body, html, #containerDiv').scrollTop(0);

scrollTo

window.scrollTo(0, 0);

- это идеальное решение для прокрутки окон вверх - самое приятное то, что он не требует никакого селектора идентификаторов, и даже если мы будем использовать структуру IFRAME, он будет работать очень хорошо.

Метод scrollTo () прокручивает документ до указанных координат.
window.scrollTo (xpos, ypos);
Номер xpos Обязательный. Координата для прокрутки по оси x (по горизонтали) в пикселях
ypos Обязательное число. Координата прокрутки по оси Y (по вертикали) в пикселях.

JQuery

Другой вариант сделать то же самое - использовать jQuery, и он даст более плавный вид для того же

$('html,body').animate({scrollTop: 0}, 100);

где 0 после scrollTop указывает положение вертикальной полосы прокрутки в пикселе, а второй параметр является необязательным параметром, который показывает время в микросекундах для выполнения задачи.

Это сработало для меня:

document.getElementById('yourDivID').scrollIntoView();

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

Exemple:

$('#elem').show();
$('#elem').scrollTop(0);

Для меня способ scrollTop не работал, но я нашел другое:

element.style.display = 'none';
setTimeout(function() { element.style.display = 'block' }, 100);

Не проверял минимальное время для надежного рендеринга css, 100 мс может быть излишним.

Если вы хотите прокручивать с плавным переходом, вы можете использовать это!

(Ванильный JS)

const tabScroll = document.getElementById("tabScroll");
window.scrollTo({
  'behavior': 'smooth',
  'left': 0,
  'top': tabScroll.offsetTop - 80
});

Если вашими целевыми пользователями являются Chrome и Firefox , тогда это хорошо! Но, к сожалению, этот метод поддерживается не всеми браузерами. Проверить здесь

Надеюсь это поможет!!

Согласно ответу Франсуа Ноэля: «Для тех, кто все еще не может выполнить эту работу, убедитесь, что перед использованием функции jQuery отображается переполненный элемент».

Я работал в модальном режиме начальной загрузки, который я неоднократно вызываю с разрешениями учетной записи в div, который переполняется по измерению y. Моя проблема заключалась в том, что я пытался использовать функцию jquery .scrollTop (0), и она не работала, как бы я ни пытался это сделать. Мне пришлось настроить событие для модального окна, которое не сбрасывает полосу прокрутки, пока модальное окно не перестанет анимироваться. Код, который наконец сработал для меня, находится здесь:

    $('#add-modal').on('shown.bs.modal', function (e) {
        $('div.border').scrollTop(0);
    });

Если html-контент переполняет одно окно просмотра, это сработало для меня, используя только javascript:

document.getElementsByTagName('body')[0].scrollTop = 0;

С Уважением,

У меня это сработало только так, с плавным переходом прокрутки:

  $('html, body').animate({
    scrollTop: $('#containerDiv').offset().top,
  }, 250);

При получении элемента по имени класса не забывайте, что возвращаемое значение - это массив; Отсюда этот код:

document.getElementByClassName("dropdown-menu").scrollTop = 0

Не сработает. Вместо этого используйте код ниже.

document.getElementByClassName("dropdown-menu")[0].scrollTop = 0

Я подумал, что другие люди могут столкнуться с подобной проблемой, как и я; так что это должно помочь.

эти два кода сработали для меня как шарм, который сначала нужно будет прокрутить до верхней части страницы, но если вы хотите прокрутить до некоторого конкретного div, используйте второй с вашим идентификатором div.

$('body, html, #containerDiv').scrollTop(0);
document.getElementById('yourDivID').scrollIntoView();

Если вы хотите прокрутить до имени класса, используйте приведенный ниже код

var $container = $("html,body");
var $scrollTo = $('.main-content');

$container.animate({scrollTop: $scrollTo.offset().top - $container.offset().top + $container.scrollTop(), scrollLeft: 0},300);

Идентификатор должен иметь идентификатор соответствующего div, имеющего свойство css переполнения.

document.querySelector('#YOUR_OVERFLOWED_DIV').scrollTop = 0;