データが追加されたときに Div の最後まで自動的にスクロールするにはどうすればよいですか?

データ追加時に Div の最後まで自動スクロール

HTML ドキュメントでは、テーブルは指定されたスタイルを持つ div 内に囲まれていますこれにより、垂直スクロールバーの可視性を確保しながら、水平オーバーフローが制限されます。目的は、新しいデータがテーブルに追加されるときに、div を一番下までスクロールすることを自動化することです。

JavaScript の解決策:

これを実現するには、JavaScript の間隔関数を使用します。雇用される。この関数は、div のscrollTop プロパティを定期的に更新して、scrollHeight と一致させます。これにより、データが追加されたときに div が自動的に一番下までスクロールするようになります。

次のコードは、これを実装する方法を示しています。

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

カスタム イベント呼び出し:

データ追加のタイミングを制御する場合、別のアプローチとして、新しいデータを追加した後に関数を手動で呼び出すことができます。これにより、間隔関数の必要性がなくなり、スクロール動作の制御がより柔軟になります。

これを実装するには、テーブルにデータを追加した後、上記のコードの内部関数を呼び出します。

elem.scrollTop = elem.scrollHeight;

以上がデータが追加されたときに Div の最後まで自動的にスクロールするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。