Latest web development tutorials
 

TableRow deleteCell() Method

< TableRow Object

Example

Delete the first cell(s) from a table row with id="myRow":

var row = document.getElementById("myRow");
row.deleteCell(0);
Try it Yourself »

Definition and Usage

The deleteCell() method deletes a cell in the current table row.

Tip: Use the insertCell() method to delete a cell in the current table row.


Browser Support

Method
deleteCell() Yes Yes Yes Yes Yes

Syntax

tablerowObject.deleteCell(index)

Parameter Values

Value Description
index Required in Firefox and Opera, optional in IE, Chrome and Safari. An integer (starts at 0) that specifies the position of the cell to delete in the current row. The value of 0 results in that the first cell will be deleted. The value of -1 can also be used; which result in that the last cell will be deleted.

If this parameter is omitted, deleteCell() removes the last cell in IE and the first cell in Chrome and Safari.

This parameter is required in Firefox and Opera, but optional in Internet Explorer, Chrome and Safari.

Technical Details

Return Value: No return value.

More Examples

Example

Delete the last cell(s) from the a table row with id="myRow":

var row = document.getElementById("myRow");
row.deleteCell(-1);
Try it Yourself »

Example

Delete cell(s) from the index position 1 in a table row with id="myRow":

var row = document.getElementById("myRow");
row.deleteCell(1);
Try it Yourself »

Example

Delete cell(s) at the beginning of the first table row. The table rows collection (.rows[0]) returns a collection of all <tr> elements in the table with id "myTable". The number [0] specifies the element to retrieve, in this example, the first table row. Then we use deleteCell() to delete cells from index position 0:

var firstRow = document.getElementById("myTable").rows[0];
firstRow.deleteCell(0);
Try it Yourself »

Example

Insert new cell(s) with content at the beginning of a table row with id="myRow":

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

< TableRow Object