tbody的滚动条显示最底部内容
时间: 2023-12-03 17:42:55 浏览: 64
可以使用JavaScript代码来实现tbody的滚动条显示最底部内容。具体步骤如下:
1. 获取tbody元素和tbody内最后一个元素。
```javascript
var tbody = document.querySelector("tbody");
var lastElement = tbody.lastElementChild;
```
2. 计算最后一个元素的距离顶部的高度。
```javascript
var lastElementHeight = lastElement.offsetTop + lastElement.clientHeight;
```
3. 判断tbody的高度是否大于最后一个元素的高度,若大于则将tbody的scrollTop设置为最后一个元素的高度减去tbody的高度。
```javascript
if (tbody.clientHeight < lastElementHeight) {
tbody.scrollTop = lastElementHeight - tbody.clientHeight;
}
```
完整的代码如下:
```javascript
var tbody = document.querySelector("tbody");
var lastElement = tbody.lastElementChild;
var lastElementHeight = lastElement.offsetTop + lastElement.clientHeight;
if (tbody.clientHeight < lastElementHeight) {
tbody.scrollTop = lastElementHeight - tbody.clientHeight;
}
```
将该代码放在需要滚动的事件中,例如在表格内容添加完成后调用该代码,即可实现tbody的滚动条显示最底部内容。
阅读全文