javascript - 如何从 Javascript 代码设置单元格宽度（HTML 表格）

Question

我有一个 HTML 表格。如何从 Javascript 代码更改该表的一个单元格的宽度？例如，我有一个按钮，当我按下它时，我希望改变一个特定列的宽度。我怎样才能做到这一点？

Answer 1

你可以在没有 jQuery 的情况下做到这一点。

工作示例：http: //jsfiddle.net/qFDBk/1/

var btn = document.getElementById('btn');

btn.onclick = function() {
    var tbl = document.getElementById('tbl');
    var td = tbl.rows[0].cells[0];
    td.width = '500px';
    td.style.backgroundColor = 'blue';
}

Answer 2

以下是使用流行的 JavaScript 库 jQuery 的方法：

http://jsfiddle.net/VJTnN/2

$('td:nth-child(2)').css('width', '100px');

Answer 3

使用 CSS 方法来应用宽度。

$('td').css('width','200px');

解释 ：

1. 获取所有 td 元素。并应用 CSS 属性宽度并将其值设置为 200px。对于每个 td 元素。
2. $('td')是标签选择器。它将选择所有 td 元素。
3. .css() 将应用您提到的样式规则。