DOM TableRow insertCell() Method
Introduction: The TableRow insertCell() Method in HTML DOM is used to add a single cell into a current Row at any particular position. It is a predefined method of the TableRow Object.
Syntax:
tablerowObject.insertCell(index)
Parameter Values:
- index: It contains a numeric that starts from 0 that indicates the position of the cell to be inserted in a current row. The value of -1 can also be used.
Note:
- The parameter is to be defined mandatory in the Firefox and Opera browser. on the other hand it is optional in safari, chrome and IE Browsers.
- If this parameter is does not contain any value, so insertCell() adds the new cell at the last position in IE and at the first position in Chrome and Safari.
Example 1: In this example, we will insert the cell at the first position using DOM TableRow insertCell() Method.
HTML
<!DOCTYPE html><html><head> <title> HTML DOM TableRow insertCell() Method </title> <style> table, td { border: 1px solid green; } h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </style></head><body> <h1>GeeksforGeeks</h1> <h2> HTML DOM TableRow insertCell() Method </h2> <table align="center"> <tr id="gfg"> <td>GEEKS</td> <td>FOR</td> </tr> </table> <br> <button onclick="row()"> Add cell at last Position </button> <script> function row() { var MyCell = document.getElementById("gfg"); var AddCell = MyCell.insertCell(-1); AddCell.innerHTML = "GEEKS"; } </script></body></html> |
Output:
Example 2: In this example, we will insert the cell at the last position using DOM TableRow insertCell() Method.
HTML
<!DOCTYPE html><html><head> <title> HTML DOM TableRow insertCell() Method </title> <style> table, td { border: 1px solid green; } h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </style></head><body> <h1>GeeksforGeeks</h1> <h2> HTML DOM TableRow insertCell() Method </h2> <table align="center"> <tr id="gfg"> <td>GEEKS</td> <td>FOR</td> </tr> </table> <br> <button onclick="row()"> Add cell at last Position </button> <script> function row() { var MyCell = document.getElementById("gfg"); var AddCell = MyCell.insertCell(-1); AddCell.innerHTML = "GEEKS"; } </script></body></html> |
Output:
Please Login to comment...