Как автоматически прокручивать до конца div при добавлении данных?

У меня есть table внутри div со следующим стилем:

#data {
    overflow-x:hidden;
    overflow-y:visible;
    height:500px;
}

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

Какой код JavaScript можно использовать для этого? В случае необходимости я открываю возможности в JQuery, но предпочел бы решение JavaScript.

Ответ 1

Если вы не знаете, когда данные будут добавлены в #data, вы можете установить интервал, чтобы обновить элемент scrollTop до его scrollHeight каждые пару секунд. Если вы контролируете добавление данных, просто вызовите внутреннюю часть следующей функции после добавления данных.

window.setInterval(function() {
  var elem = document.getElementById('data');
  elem.scrollTop = elem.scrollHeight;
}, 5000);

Ответ 2

var objDiv = document.getElementById("divExample");
objDiv.scrollTop = objDiv.scrollHeight;