如何可靠地跟踪动态更新HTML表格的底部？

Question

我已经在SO上读到了关于如何做到这一点的类似问题，但我的设置略有不同，并且针对这些问题提出的解决方案产生了一个奇怪的结果。

在我的页面上，我有一个DIV，其高度已经固定，我已经获得了ID table-container。正如ID建议的那样，它包含一个表（id="myTable"），每隔几秒使用JavaScript将一行附加到底部。我试图实现的效果是，随着表的大小增加，超出表容器的大小，表容器DIV将向下滚动，以便最后一行始终可见。

我已使用以下JavaScript来实现此目的：

$('#table-container').scrollTop ($('#myTable tr:last').position().top);

这适用于前20行左右的添加，但之后它完全失去了对底行的跟踪。我无法弄清楚为什么它开始这么好，然后搞砸了。

我创建了一个说明问题的JSFiddle。 https://jsfiddle.net/crickes/meqzf4g1/16/

Answer 1

为什么你不能$('#table-container').scrollTop ($('#myTable').height() );？