วิธาสร้างคำอธิบายตาราง (Table Caption) ด้วย JavaScript DOM

หากต้องการสร้างคำอธิบายตาราง (caption) ให้ใช้เมธอด createCaption() ของ DOM

ตัวอย่าง

ลองรันโค้ดด้านล่างเพื่อเรียนรู้วิธาสร้างคำอธิบายตาราง:

<!DOCTYPE html>
<html>
  <head>
    <script>
      function captionFunc(x) {
        document.getElementById(x).createCaption().innerHTML = "Demo Caption";
      }
    </script>
  </head>
  <body>
    <table style="border:2px solid black" id="newtable">
      <tr>
        <td>One</td>
        <td>Two</td>
      </tr>
      <tr>
        <td>Three</td>
        <td>Four</td>
      </tr>
      <tr>
        <td>Five</td>
        <td>Six</td>
      </tr>
    </table>
    <p>
      <input type="button" onclick="captionFunc('newtable')" value="Display Table Caption">
    </p>
  </body>
</html>

คำอธิบาย: เมธอด createCaption() จะสร้างแท็ก <caption> ให้กับตาราง หากตารางมี caption อยู่แล้ว จะคืนค่า caption ที่มีอยู่เดิม แล้วเราสามารถกำหนดเนื้อหาผ่าน innerHTML ได้