HTMLTableCellElementï¼abbr å±æ§

åºçº¿ å¹¿æ³å¯ç¨

HTMLTableCellElement æ¥å£ç abbr å±æ§æç¤ºä¸ååæ ¼ç¸å³èçç¼©åãå¦æååæ ¼ä¸æ¯è¡¨å¤´ååæ ¼ <th>ï¼åå¿½ç¥è¯¥å±æ§ã

å®åæ <th> åç´ ç abbr å±æ§ã

å¼

ä¸ä¸ªåç¬¦ä¸²ã

ç¤ºä¾

HTML

html

<table>
  <thead>
    <tr>
      <th abbr="Maker">å¶é å</th>
      <th abbr="Model">æ±½è½¦åå·</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>ç¹æ¯æ</td>
      <td>3</td>
    </tr>
    <tr>
      <td>æ¯äºè¿ª</td>
      <td>æµ·è±</td>
    </tr>
    <tr>
      <td>å¤§ä¼</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}ï¼`;
}