In this example you will learn, how to Count Number of Rows in a Table Using jQuery. You can simply use the length property to count or find the number of rows in an HTML table using jQuery. This property can be used to get the number of elements in any jQuery object.
Let’s try out the following example to understand how it actually works:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery Get Number of Rows in a Table</title> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ var rowCount = $("#myTable tr").length; alert(rowCount); // Outputs: 4 }); }); </script> </head> <body> <table id="myTable"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <tr> <td>1</td> <td>John</td> <td>25</td> </tr> <tr> <td>2</td> <td>Peter</td> <td>18</td> </tr> <tr> <td>3</td> <td>Harry</td> <td>14</td> </tr> </table> <button type="button">Get Number of Rows</button> </body> </html> |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.