Javascript operation table (detailed explanation of insertRow, deleteRow, insertCell, deleteCell method)_javascript skills

insertRow() method

Definition and usage

The insertRow() method is used to insert a new row at the specified position in the table.

Grammar

tableObject.insertRow(index)

Return value

Returns a TableRow representing the newly inserted row.

Description

This method creates a new TableRow object, representing a new tag, and inserts it into the table at the specified position.

The new row will be inserted before the row at index. If index is equal to the number of rows in the table, new rows will be appended to the end of the table.

If the table is empty, the new row will be inserted into a new segment, which itself will be inserted into the table.

Throws

If the parameter index is less than 0 or greater than or equal to the number of rows in the table, this method will throw a DOMException exception with code INDEX_SIZE_ERR.

Example

Copy code The code is as follows:

< html>

< td>Row1 cell2

Row1 cell1
Row2 cell1	Row2 cell2

value="Insert new row">

deleteCell()

Definition and usage

deleteCell() method is used to delete cells ( elements) in table rows.

Grammar

tablerowObject.deleteCell(index)

Description

The parameter index is the position of the table element to be deleted in the row.

This method will delete the table element at the specified position in the table row.

Throws

If the parameter index is less than 0 or greater than or equal to the number of table elements in the row, this method will throw a DOMException exception with code INDEX_SIZE_ERR.

Example

Copy code The code is as follows:

< html>

Row1 cell1	Row1 cell2
Row2 cell1	Row2 cell2

value="Delete first row">

insertCell()

Definition and usage

The

insertCell() method is used to insert an empty element at a specified position in a row of an HTML table.

Grammar

tablerowObject.insertCell(index)

Return value

A TableCell object representing the newly created and inserted element.

Description

This method will create a new element and insert it into the row at the specified position. The new cell will be inserted before the cell currently at the position specified by index. If index is equal to the number of cells in the row, the new cell is appended to the end of the row.

Please note that this method can only insert data table elements. If you need to add a header element to a row, you must create and insert a element using the Document.createElement() method and the Node.insertBefore() method (or related methods).

Throws

If the parameter index is less than 0 or greater than or equal to the number of table elements in the row, this method will throw a DOMException exception with code INDEX_SIZE_ERR.

Example

Copy code The code is as follows:

< html>

< /tr>

Firstname	Lastname
Peter	Griffin

deleteCell()

Definition and usage

deleteCell() method is used to delete cells ( elements) in table rows.

Grammar

tablerowObject.deleteCell(index)

Description

The parameter index is the position of the table element to be deleted in the row.

This method will delete the table element at the specified position in the table row.

Throws

If the parameter index is less than 0 or greater than or equal to the number of table elements in the row, this method will throw a DOMException exception with code INDEX_SIZE_ERR.

Example

Copy code The code is as follows:

< html>

< /tr>

Firstname	Lastname
Peter	Griffin

Application in the project:

Copy code The code is as follows: