HTMLTableCellElement: abbr プロパティ
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。
abbr は HTMLTableCellElement インターフェイスのプロパティで、セルに関連付けられた略語を示します。そのセルが見出しセル <th> ではない場合、このプロパティは無視されます。
これは、<th> 要素の abbr 属性を反映します。
メモ: このプロパティは、ブラウザー上では視覚的な効果をもたらしません。これは、スクリーンリーダーなどの支援技術がこの略語を使用することができるようにするための情報を追加するものです。
値
文字列です。
例
この例では、それぞれの行で最初のセルにある見出しに関連付けられた略語を接頭辞として追加します。
HTML
html
<table>
<thead>
<tr>
<th abbr="メーカー">製造者</th>
<th abbr="モデル">車の型番</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>
JavaScript
js
const rows = document.querySelectorAll("thead tr");
const cells = rows[0].cells;
for (const cell of cells) {
cell.textContent = `${cell.textContent} (${cell.abbr})`;
}
結果
仕様書
| 仕様書 |
|---|
| HTML> # dom-th-abbr> |