TableRow insertCell() 方法

Objek DOM TableRow HTML

定义和用法

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

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

另请参阅：

HTML 参考手册：Tag <tr> HTML

实例

例子 1

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

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

Coba Sendiri

页面下方提供更多实例。

语法

tablerowObject.insertCell()indeks)
Parameter Penerangan
indeks

Wajib di Firefox dan Opera, pilihan di IE, Chrome dan Safari.

Nombor (dari 0), menentukan tempat sel baru di baris semasa.

Nombor 0 akan menyebabkan sel baru disisipkan di tempat pertama. Juga boleh digunakan nilai -1, yang akan menyebabkan sel baru disisipkan di tempat terakhir.

Jika parameter ini diabaikan, kaedah insertCell() akan memasukkan sel baru di tempat terakhir di IE, dan di tempat pertama di Chrome dan Safari.

Perincian teknikal

Hasil balik:

Elemen sel yang disisipkan.

Pendukir pelayar

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Dipendukir Dipendukir Dipendukir Dipendukir Dipendukir

Lebih banyak contoh

Contoh 2

Masukkan sel baru yang mengandungi kandungan di akhir baris tabel dengan id="myRow":

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

Coba Sendiri

Contoh 3

Masukkan sel baru yang mengandungi kandungan di indeks 2 bagi baris tabel dengan id="myRow":

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

Coba Sendiri

Contoh 4

Masukkan sel baru di mulai baris pertama tabel. Koleksi rows (.rows[0]) mengembalikan koleksi semua elemen <tr> yang ada di dalam table dengan id "myTable".

Nombor [0] menentukan elemen yang hendak dicari, di contoh ini, adalah baris pertama tabel. kemudian kami menggunakan insertcell() untuk memasukkan sel baru di indeks -1:

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

Coba Sendiri

Contoh 5

Buang sel pertama daripada baris table dengan id="myRow":

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

Coba Sendiri

Contoh 6

Masukkan baris baru di mulai table.

kaedah insertRow() memasukkan baris baru di tempat indeks yang ditetapkan di dalam table, di contoh ini, tempat pertama (mulai) bagi table dengan id="myTable".

kemudian kami menggunakan kaedah insertCell() untuk menambah sel di baris baru.

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

Coba Sendiri

Objek DOM TableRow HTML