无法在 JS 生成的表中设置 TD 宽度

can't set td width in js-generated table

本文关键字：设置 TD 宽度 JS      更新时间：2023-09-26

我正在生成一个简单的html表格，并希望在同一行中具有不同宽度的列。但是，当我尝试使用像素或%设置宽度时，显示没有变化。此外，添加的第一列（'td' 元素）总是比以后添加的其他列宽得多。我尝试在创建元素后和将其追加为子节点之前设置宽度，以及仅在将元素追加为子节点后设置宽度。这是我尝试过的一个例子：

                    var tr = document.createElement('TR');
                    tr.style.margin = "50px"
                    //scoring column
                    var td0 = document.createElement('TD')
                    td0.style.padding = '1em'
                    td0.style.width = '2px'
                    var tr11 = document.createElement('TR');
                    tr11.style.margin = "50px"
                    tr11.innerHTML ="score: " +  ascore_array[i + offset];
                    var tr22 = document.createElement('TR');
                    tr22.style.margin = "50px"
                    tr22.innerHTML ="num votes: " +  anumVotes_array[i + offset];
                    td0.appendChild(tr11)
                    td0.appendChild(tr22)

                    //answer column
                    var td1 = document.createElement('TD')
                    td1.style.padding = "1em"
                    td1.innerHTML =   auser_array[i + offset]
                    tr.appendChild(td0)
                    td0.style.width = "20%"
                    tr.appendChild(td1)
                    td1.style.width = "30%"

正如您在上面的代码中看到的，我已经尝试了 px 和 % 作为宽度单位。我还尝试在将元素设置为子节点之前和之后设置宽度。我的代码没有变化。另外，我正在使用css模板，但它们只为我的表元素设置默认背景颜色。css 中没有任何常规 td 元素大小调整的内容。我也尝试调整 td 元素中的 tr 元素的大小，但这也没有效果。

我正在使用 Chrome 作为我的浏览器。

我做错了什么，我该如何解决？

好的，

我想我明白问题出在哪里了。根<table>和<tbody>之间有一个<col style="width: 80%;">和一个<col style="width: 20%;">，它覆盖了下面<td>中的样式

也许这可以帮助你

var cell = document.createElement('td');
parent.appendChild(cell);
cell.style.width = '200px';

http://jsfiddle.net/ZvEDn/1/ç

这是我在哪里找到它的问题如何在使用"document.createElement（）"方法创建后立即在JavaScript中设置单元格宽度？

相关文章：