Thuộc tính emptyCells trong HTML DOM Style

Giới thiệu

Thuộc tính emptyCells trong HTML DOM Style dùng để chỉ định cách hiển thị các ô trống (empty cells) trong bảng (<table>). Mặc định giá trị là show.

Cú pháp

Thiết lập emptyCells:

empty-cells: show|hide|initial|inherit;

Trong đó: show hiển thị viền ô trống, hide ẩn viền ô trống. initial đặt về mặc định, inherit kế thừa từ cha.

Ví dụ

Ví dụ ẩn ô trống ban đầu, sau đó nhấn nút để hiển thị chúng.

<!DOCTYPE html> <html> <head> <style> 
  #TABLE1 { 
    font-style: italic; 
    empty-cells: hide; 
  } 
  table, td { 
    margin: 5px; 
    padding: 3px; 
    border: 1px solid black; 
  } 
</style> <script> 
  function showEmptyCells() { 
    document.getElementById("TABLE1").style.emptyCells = "show"; 
    document.getElementById("Sample").innerHTML = "Các ô trống của bảng bây giờ sẽ hiển thị"; 
  } 
</script> </head> <body> 
  <table id="TABLE1"> 
    <tr> 
      <td>demo</td> 
      <td></td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>demo</td> 
      <td></td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>demo</td> 
      <td></td> 
      <td></td> 
    </tr> 
  </table> 
  <p>Nhấn nút để hiển thị các ô trống bị ẩn</p> 
  <button onclick="showEmptyCells()">Hiện ô trống</button> 
  <p id="Sample"></p> 
</body> </html>

Kết quả

Sau khi nhấn nút Hiện ô trống: