HTMLTableCellElement: thuộc tính abbr

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Thuộc tính abbr của giao diện HTMLTableCellElement cho biết một từ viết tắt liên kết với ô. Nếu ô không đại diện cho một ô tiêu đề <th>, nó sẽ bị bỏ qua.

Nó phản ánh thuộc tính abbr của phần tử <th>.

Note: Thuộc tính này không có hiệu ứng trực quan trong trình duyệt. Nó thêm thông tin để hỗ trợ công nghệ hỗ trợ như trình đọc màn hình có thể sử dụng từ viết tắt này

<table>
  <thead>
    <tr>
      <th abbr="Maker">Manufacturer</th>
      <th abbr="Model">Car model</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Tesla</td>
      <td>3</td>
    </tr>
    <tr>
      <td>BYD</td>
      <td>Dolphin</td>
    </tr>
    <tr>
      <td>VW</td>
      <td>ID.3</td>
    </tr>
  </tbody>
</table>

table {
  border-collapse: collapse;
}

th,
td,
table {
  border: 1px solid black;
}

button {
  margin: 1em 1em 1em 0;
}

JavaScript

const rows = document.querySelectorAll("thead tr");
const cells = rows[0].cells;

for (const cell of cells) {
  cell.textContent = `${cell.textContent} (${cell.abbr})`;
}