HTML DOM टेबल rows कलेक्शन: सभी <tr> एलिमेंट्स एक्सेस करना

HTML DOM टेबल rows कलेक्शन एक HTML दस्तावेज़ में टेबल के सभी <tr> एलिमेंट्स का कलेक्शन लौटाता है। इसमें <thead>, <tbody>, और <tfoot> की सभी पंक्तियां शामिल होती हैं।

सिंटैक्स

object.rows

rows कलेक्शन के गुण

rows कलेक्शन के मेथड्स

उदाहरण: पंक्तियों की संख्या गिनना

<!DOCTYPE html>
<html>
<style>
  body { color: #000; background: lightblue; height: 100vh; text-align: center; }
  table { margin: 2rem auto; }
  .show { font-size: 1.2rem; }
  .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem auto; }
</style>
<body>
  <h1>DOM टेबल rows कलेक्शन डेमो</h1>
  <table border="2">
    <thead>
      <tr> <th>नाम</th> <th>रोल नं.</th> </tr>
    </thead>
    <tbody>
      <tr> <td>जॉन</td> <td>071717</td> </tr>
      <tr> <td>जेन</td> <td>031717</td> </tr>
    </tbody>
  </table>
  <button onclick="get()" class="btn">पंक्तियों की संख्या प्राप्त करें</button>
  <div class="show"></div>
  <script>
    function get() {
      var table = document.querySelector('table');
      document.querySelector('.show').innerHTML = 'पंक्तियों की संख्या: ' + table.rows.length;
    }
  </script>
</body>
</html>

आउटपुट

1. प्रारंभ में: टेबल हेडर + 2 डेटा पंक्तियां = 3 पंक्तियां
2. "पंक्तियों की संख्या प्राप्त करें" क्लिक: "पंक्तियों की संख्या: 3" प्रदर्शित

rows vs tBodies.rows

पंक्तियों पर पुनरावृति उदाहरण

var table = document.querySelector('table');
for (var i = 0; i < table.rows.length; i++) {
  var row = table.rows[i];
  console.log('पंक्ति ' + i + ': ' + row.innerText);
}