html表格清除列宽什么意思,javascript – 隐藏表格行时HTML列宽会发生变化

我是网络编程的新手,所以我可能在这里犯了一些明显的错误.

当我试图在诸如rows [i] .style.display =’none’之类的javascript中隐藏表中的行时,表格布局会完全破坏.最初,细胞内容被包裹起来,桌子的宽度也在缩小.然后我在table标签中添加了style =“table-layout：fixed”,并在每个td中添加了style =“white-space：nowrap”.这会阻止换行,但内容仍然没有在一行上对齐.如果空间和列宽从一行到另一行变化,则单元格开始向左移动.然后,我为每个th和td元素以及包含该表的div添加了固定宽度.问题仍然存在.

我目前的HTML类似于以下内容.

Header 1	Header 2	Header 3
Data 1_1 in Row 1	Data 1_2 in Row 1	Data 1_3 in Row 1
Data 2	Data 2	Data 2
Data 3_1	Data 3_2	Data 3_3

当第一次显示表格时,列正确对齐,宽度分别为100,50和150像素.但是如果有一行,比如第二个被隐藏,则剩下的两个显示行的单元格宽度不再固定为100,50和150,并且数据不再垂直对齐.请注意,整个桌子宽度仍然是300像素.如果有可用空间,则每个单元格中的数据向左移动,并且最后一个使用额外空间,在本例中为第三列.

我们非常欢迎任何帮助.