TableRow insertCell() 方法

HTML DOM TableRow-objekt

定义和用法

insertCell() 方法将单元格插入到当前行中。

提示：请使用 deleteCell() 方法 删除当前表格行中的单元格。

另请参阅：

HTML 参考手册：HTML <tr> etikett

实例

例子 1

在 id="myRow" 的表格行的开头插入包含内容的新单元格：

var row = document.getElementById("myRow");
var x = row.insertCell(0);
x.innerHTML = "New cell";

Prova själv

页面下方提供更多实例。

语法

tablerowObject.insertCell()index)
Parameter Beskrivning
index

Obligatorisk i Firefox och Opera, valfri i IE, Chrome och Safari.

Numer (från 0), som specificerar positionen för den nya cellen i den aktuella raden.

Värdet 0 kommer att leda till att den nya cellen placeras på den första positionen. Det kan också användas värdet -1, vilket kommer att leda till att den nya cellen placeras på den sista positionen.

Om denna parameter övervägs, kommer insertCell() i IE att lägga till en ny cell på den sista positionen, och i Chrome och Safari på den första positionen.

Tekniska detaljer

Returvärde:

Insatta cell-element.

Browserstöd

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Stöd Stöd Stöd Stöd Stöd

Mer exempel

Exempel 2

Lägg till en ny cell med innehåll i slutet av tabellraden med id="myRow":

var row = document.getElementById("myRow");
var x = row.insertCell(-1);
x.innerHTML = "New cell";

Prova själv

Exempel 3

Lägg till en ny cell med innehåll på indexplatsen 2 i tabellraden med id="myRow":

var row = document.getElementById("myRow");
var x = row.insertCell(2);
x.innerHTML = "New cell";

Prova själv

Exempel 4

Lägg till en ny cell i början av den första tabellraden. Samlingen rows (.rows[0]) returnerar samlingen av alla <tr>-element i tabellen med id "myTable".

Numret [0] specificerar det element som ska sökas efter, i detta fall, den första tabellraden. Därefter använder vi insertcell() för att lägga till en ny cell på indexplatsen -1:

var firstRow = document.getElementById("myTable").rows[0];
var x = firstRow.insertCell(-1);
x.innerHTML = "New cell";

Prova själv

Exempel 5

Ta bort den första cellen från tabellraden med id="myRow":

var row = document.getElementById("myRow");
row.deleteCell(0);

Prova själv

Exempel 6

Lägg till en ny rad i början av tabellen.

metoden insertRow() lägger till en ny rad på den förbestämda indexplatsen i tabellen, i detta fall, på den första platsen (början) för tabellen med id="myTable".

då använder vi metoden insertCell() för att lägga till en cell i den nya raden.

var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "NYTT CELLE1";
cell2.innerHTML = "NYTT CELLE2";

Prova själv

HTML DOM TableRow-objekt