Question

如何计算每一行的td，应该说第1行有2个td，第3行有1个td。我需要计算每行的td（tr）

$(function() {
  $('.Create-New-Order').click(function() {
    var total = $('#mytbl td').length;
    alert('tr count = ' + total);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<table border="1px solid red">
  <tr>
    <th>Name</th>
    <th>Email</th>
  </tr>
  <tbody id="mytbl">
    <tr>
      <td>sfdsd</td>
      <td>tsdaf@ymail.com</td>
    </tr>
    <tr>
      <td>sfdsd</td>
      <td>tsdaf@ymail.com</td>
    </tr>
    <tr>
      <td>sfdsd</td>
    </tr>
  </tbody>
</table>
<br>
<br>
<a href="#" class="Create-New-Order">Create-New-Order</a>

Answer 1

您需要遍历每一行，然后使用$(this).find('td').length获取单元格数：

$('.Create-New-Order').click(function() {
  var total = $('#mytbl tr').each(function() {
    console.log($(this).find('td').length)
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<table border="1px solid red">
  <tr>
    <th>Name</th>
    <th>Email</th>
  </tr>
  <tbody id="mytbl">
    <tr>
      <td>sfdsd</td>
      <td>tsdaf@ymail.com</td>
    </tr>
    <tr>
      <td>sfdsd</td>
      <td>tsdaf@ymail.com</td>
    </tr>
    <tr>
      <td>sfdsd</td>
    </tr>
  </tbody>
</table>
<br>
<br>
<a href="#" class="Create-New-Order">Create-New-Order</a>

Answer 2

这很容易，首先让循环的所有行分别抛出并计算td。

见下文

    $(function() {
      $('.Create-New-Order').click(function() {
        var trs=document.querySelectorAll("#mytbl tr")
        trs.forEach(function(tr){
          console.log(tr.querySelectorAll("td").length)
        })

        
      });
    });

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

    <table border="1px solid red">
      <tr>
        <th>Name</th>
        <th>Email</th>
      </tr>
      <tbody id="mytbl">
        <tr>
          <td>sfdsd</td>
          <td>tsdaf@ymail.com</td>
        </tr>
        <tr>
          <td>sfdsd</td>
          <td>tsdaf@ymail.com</td>
        </tr>
        <tr>
          <td>sfdsd</td>
        </tr>
      </tbody>
    </table>
    <br>
    <br>
    <a href="#" class="Create-New-Order">Create-New-Order</a>

jQuery：-计算每个tr中的td数

2 个答案: