TableRow insertCell() 方法
示例
在 id="myRow" 的表格行开头插入新的单元格(带内容)
var row = document.getElementById("myRow");
var x = row.insertCell(0);
x.innerHTML = "新单元格";
自己尝试 »
描述
insertCell() 方法在当前行中插入一个单元格。
提示: 使用 deleteCell() 方法删除当前表格行中的单元格。
浏览器支持
方法 | |||||
---|---|---|---|---|---|
insertCell() | 是 | 是 | 是 | 是 | 是 |
语法
tablerowObject.insertCell(index)
参数值
值 | 描述 |
---|---|
index | 在 Firefox 和 Opera 中必需,在 IE、Chrome 和 Safari 中可选。一个数字(从 0 开始),指定新单元格在当前行中的位置。值为 0 导致新单元格将插入到第一个位置。也可以使用值为 -1;这导致新单元格将插入到最后一个位置。 如果省略此参数,insertCell() 会在 IE 中将新单元格插入到最后一个位置,在 Chrome 和 Safari 中插入到第一个位置。 此参数在 Firefox 和 Opera 中是必需的,但在 Internet Explorer、Chrome 和 Safari 中是可选的。 |
技术细节
返回值 | 插入的单元格元素 |
---|
更多示例
示例
在 id="myRow" 的表格行末尾插入新的单元格(带内容)
var row = document.getElementById("myRow");
var x = row.insertCell(-1);
x.innerHTML = "新单元格";
自己尝试 »
示例
在 id="myRow" 的表格行的索引位置 2 插入新的单元格(带内容)
var row = document.getElementById("myRow");
var x = row.insertCell(2);
x.innerHTML = "新单元格";
自己尝试 »
示例
在第一个表格行开头插入新的单元格。表格行集合 (.rows[0]) 返回 id 为 "myTable" 的表格中所有 <tr> 元素的集合。数字 [0] 指定要检索的元素,在本例中是第一个表格行。然后我们使用 insertcell() 在索引位置 -1 插入新的单元格。
var firstRow = document.getElementById("myTable").rows[0];
var x = firstRow.insertCell(-1);
x.innerHTML = "新单元格";
自己尝试 »
示例
在表格开头插入新的行。insertRow() 方法在表格中指定索引处插入新行,在本例中是 id 为 "myTable" 的表格的第一个位置(开头)。然后我们使用 insertCell() 方法在新行中添加单元格。
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "NEW CELL1";
cell2.innerHTML = "NEW CELL2";
自己尝试 »
❮ TableRow 对象