HTMLTableCellElement : propriété abbr

Baseline Widely available

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis ⁨juillet 2015⁩.

La propriété abbr de l'interface HTMLTableCellElement indique une abréviation associée à la cellule. Si la cellule ne représente pas une cellule d'en-tête <th>, elle est ignorée.

Elle reflète l'attribut abbr de l'élément HTML <th>.

Note : Cette propriété n'a pas d'effet visuel dans les navigateurs. Elle ajoute des informations pour aider les technologies d'assistance comme les lecteurs d'écran qui peuvent utiliser cette abréviation.

<table>
  <thead>
    <tr>
      <th abbr="Fabricant">Constructeur</th>
      <th abbr="Modèle">Modèle de voiture</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Tesla</td>
      <td>3</td>
    </tr>
    <tr>
      <td>BYD</td>
      <td>Dauphin</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})`;
}