Skip to content
Related Articles

Related Articles

Improve Article

HTML DOM TableRow deleteCell() Method

  • Last Updated : 31 Aug, 2021
Geek Week

The TableRow deleteCell() Method in HTML DOM is used to delete a cell from a current row in a Table. It is a predefined method of the TableRow Object. 

Syntax:

tablerowObject.deleteCell(index)

Property Values:

  • index: It contains a numeric value that starts from 0 which defines the position of the cell to be deleted from the current row. For example- The value 0th indicates the first positioned cell to be deleted. The value -1th represent that delete the last positioned cell. 

 



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 not contain any value, it  deleteCell() delete the last cell in IE and the first cell in Chrome and Safari.

Example: In this example, we will delete the first and cell from the current row. 

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>
        HTML DOM TableRow deleteCell() 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 deleteCell() Method
    </h2>
  
    <table align="center">
        <tr id="gfg">
            <td>GEEKS</td>
            <td>FOR</td>
            <td>GEEKS</td>
        </tr>
    </table>
    <br>
    <button onclick="firstCell()">
        Delete the First Cell
    </button>
    <button onclick="lastCell()">
        Delete the Last Cell
    </button>
    <script>
        function firstCell() {
            var Cell =
                document.getElementById("gfg");
            Cell.deleteCell(0);
        }
        function lastCell() {
            var MyCell = document.getElementById("gfg");
            MyCell.deleteCell(-1);
        }
    </script>
</body>
  
</html>

Output:

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :