TableRow insertCell() 方法

HTML DOM TableRow 对象

定义和用法

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

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

另请参阅：

HTML 参考手册：HTML <tr> 标签

实例

例子 1

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

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

亲自试一试

页面下方提供更多实例。

语法

tablerowObject.insertCell()index)
Parametro Paglalarawan
index

Ito ay kinakailangan sa Firefox at Opera, at opsyonal sa IE, Chrome at Safari.

Ang numero (mula sa 0), ay nagtutukoy sa posisyon ng bagong cell sa kasalukuyang linya.

Ang halaga na 0 ay magiging dahilan para idudugtong ang bagong cell sa unang posisyon. Maaari ring gamitin ang halaga na -1, na magiging dahilan para idudugtong ang bagong cell sa huling posisyon.

Kung pinagbawalan ang parametro na ito, ang insertCell() sa IE ay idudugtong sa huling posisyon, sa Chrome at Safari ay idudugtong sa unang posisyon.

Detalye ng teknolohiya

Halimbawa ng balyo:

Elemento ng cell na idinudugtong.

Suporta ng browser

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporta Suporta Suporta Suporta Suporta

Mga dagdag na halimbawa

Mga Halimbawa 2

Magdagdag ng bagong cell na may nilalaman sa huli ng linya ng table na may id="myRow":

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

亲自试一试

Mga Halimbawa 3

Magdagdag ng bagong cell na may nilalaman sa indeks na 2 ng linya ng table na may id="myRow":

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

亲自试一试

Mga Halimbawa 4

Magdagdag ng bagong cell sa simula ng unang linya ng table. Ang collection ng rows (.rows[0]) ay ibibigay ng lahat ng <tr> elements ng table na may id "myTable".

Ang numero [0] ay nagtutukoy sa elemento na dapat hahanapin, sa kasong ito, ang unang linya ng table. Pagkatapos namin ay gumagamit ng insertcell() upang magdagdag ng bagong cell sa indeks na -1:

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

亲自试一试

Mga Halimbawa 5

Tanggalin ang unang cell mula sa linya ng table na may id="myRow":

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

亲自试一试

Mga Halimbawa 6

Magdagdag ng bagong hilera sa simula ng table.

Ang method na insertRow() ay magdudugtong ng bagong hilera sa natukoy na indeks ng table, sa kasong ito, ang unang posisyon ng table na may id="myTable" (sa simula).

Pagkatapos namin ay gumagamit ng paraan ng insertCell() upang magdagdag ng cell sa bagong hilera.

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";

亲自试一试

HTML DOM TableRow 对象