JQuery 循环通过 tbody > tr 获取子元素

Question

我正在尝试循环我的 tbody 并获取 tr 元素值。我的表示例:

<table id='table-draggable1' class="table">
  <tbody id="myTbody" class="connectedSortable">
    <tr>
      <input type="hidden" value="1"  />
      <td>Test1</td>
      <td><input class="btn btn-danger" value=" Remove " onclick="removeFromAllocation(this)"  /></td>
    </tr>
    <tr>
      <input type="hidden" value="1"  />
      <td>Test2</td>
      <td><input class="btn btn-danger" value=" Remove " onclick="removeFromAllocation(this)" /></td>
    </tr>
    <tr>
      <input type="hidden" value="1"  />
      <td>Test3</td>
      <td><input class="btn btn-danger" value=" Remove " onclick="removeFromAllocation(this)" /></td>
    </tr>
  </tbody>
</table>

然后使用 jquery 我可以循环遍历 tbody，但是如何获取第一个输入值和第一个 td 文本。例如，第一个循环我想获取 value=1 和 text=Test1

$('#myTbody > tr').each(function() {
    console.debug($(this));
});

谢谢

Answer 1

您可以使用find方法找到您想要的子标签，然后使用其他特定方法进一步到达您需要去的地方。下面是 jQuery 遍历 DOM 的所有方法的详细列表:https://api.jquery.com/category/traversing/

例如，

eq 允许您在搜索的上下文中通过索引来选择元素。https://api.jquery.com/eq/

$('#myTbody > tr').each(function() {
    var value = $(this).find('input').val();
    var text = $(this).find('td').eq(0).text();
});

fiddle :https://jsfiddle.net/35c1yc10/