การนับแถว (rows) ของตาราง
ใช้ property .rows.length ของ element <table> เพื่อดึงจำนวนแถวทั้งหมด (รวม header และ body)
ตัวอย่างโค้ดเต็ม
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>นับแถวตาราง</title>
</head>
<body>
<table id="tblDemo" border="1">
<thead>
<tr><th>Name</th><th>Age</th></tr>
</thead>
<tbody>
<tr><td>John</td><td>21</td></tr>
<tr><td>David</td><td>22</td></tr>
<tr><td>Bob</td><td>20</td></tr>
<tr><td>Mike</td><td>24</td></tr>
</tbody>
</table>
<script>
var allTableData = document.getElementById("tblDemo");
var totalNumbeOfRows = allTableData.rows.length;
console.log("Total Number Of Rows = " + totalNumbeOfRows); // ผลลัพธ์: 5 (1 header + 4 body)
</script>
</body>
</html>
ผลลัพธ์
Total Number Of Rows = 5
คำอธิบาย
tableElement.rowsคืนค่า HTMLCollection ของแถวทั้งหมด (<tr>)- นับรวม <thead>, <tbody>, <tfoot> ทุกแถว
- หากต้องการนับแค่ <tbody> ใช้
tableElement.tBodies[0].rows.length
