对于已呈现的表,如果隐藏某行,则会根据内容动态重新计算列的宽度:
function switchRow(ixRow){
let table = document.getElementById('theTable');
let row = table.rows[ixRow];
let currentVisibility = row.style.display;
row.style.display= currentVisibility== 'none' ? 'table-row' : 'none';
}
table{
border: 2px solid black;
padding: .5em;
}
<table id='theTable'>
<tr><td>Hellen</td><td>Smith</td></tr>
<tr><td>Montgomery</td><td>Wolfeschlegelsteinhausenbergerdorff</td></tr>
</table>
<br>
<button onclick="switchRow(1)">Switch row 1</button>
有没有一种简单的方法可以在第一次渲染后“冻结”所有列的宽度,以便隐藏/显示所有表/列的宽度?
编辑以区别于假定重复的其他问题
我想要的是保留在呈现表时计算的宽度——无论规则是显式的还是隐式的。一旦显示,宽度必须恒定。
我不想添加任何宽度优先规则,我想要表的默认呈现,但一旦呈现,我不会在宽度上进行动态更改。