html table 动态适应表格高度宽度

CalculateWidth() {
var tables = this.tables;
var tableLength = tables.length;
window.requestAnimationFrame(()=>{
for (let i = 0; i < tableLength; i++) {//循环表
let columnLen = tables[i].columns.length;//获取表有多少列
for (let c = 0; c < columnLen; c++) {
let cells = document.getElementsByClassName("table_" + (i) + "_col_" + (c));//获取列有多少单元格
let cellLen = cells.length;
let MaxLen = 0;
for (let j = 0; j < cellLen; j++) {
MaxLen = Math.max(cells[j].innerText.length, MaxLen);
}
console.log(`第${c+1}列最宽：${MaxLen}`)
for (let j = 0; j < cellLen; j++) {
cells[j].style.width = ((MaxLen) * 17 + 20) + "px";
}
}
}
})
},
CalculateHeight() {
var items = this.tables[0].rows.length;
for (let i = 0; i < items; i++) {
let rows = document.getElementsByClassName("row_" + i);
let rowsCount = rows.length;
let MaxRow = 0;
for (let j = 0; j < rowsCount; j++) {
MaxRow = Math.max(MaxRow, $(rows[j]).find(".table-row2").length);
}
for (let j = 0; j < rowsCount; j++) {
rows[j].style.height = (MaxRow * 30) + "px";
}
}
}

 

看得懂就看 就不懂就算