Bảng HTML DOM Phương thức deleteRow ()

Phương thức HTML DOM table deleteRow () xóa một phần tử khỏi bảng trong tài liệu HTML.

Cú pháp

Sau đây là cú pháp -

object.deleteRow(index)

Ở đây, chỉ mục đại diện cho một số chỉ định vị trí của hàng cần xóa.

Hãy để chúng tôi xem một ví dụ về phương thức deleteRow () của bảng HTML DOM -

Ví dụ

<!DOCTYPE html>
<html>
<style>
   body {
      color: #000;
      background: lightblue;
      height: 100vh;
      text-align: center;
   }
   table {
      margin: 2rem auto;
   }
   .btn {
      background: #db133a;
      border: none;
      height: 2rem;
      border-radius: 2px;
      width: 40%;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
      margin: 1rem auto;
   }
   .show {
      font-size: 1.2rem;
   }
</style>
<body>
<h1>DOM Table deleteRow() Method Demo</h1>
<table border="2">
<thead>
<tr>
<th>Name</th>
<th>Roll No.</th>
</tr>
<thead>
<tbody>
<tr>
<td>John</td>
<td>071717</td>
</tr>
<tr>
<td>Jane</td>
<td>031717</td>
</tr>
</tbody>
</table>
<button onclick="remove()" class="btn">Remove Row</button>
<script>
   function remove() {
      var tableFooter = document.querySelector('table').deleteRow(1);
   }
</script>
</body>
</html>

Đầu ra

Bảng HTML DOM Phương thức deleteRow ()

Nhấp vào “ Xóa hàng ”Để xóa một hàng khỏi bảng.

Bảng HTML DOM Phương thức deleteRow ()