Question

我想遍历表id =“myTable”中每行中的每个单元格，并获取单元格子div的id。

到目前为止，我有类似的内容：

$("td.theCell").each(function() {
  var id = $(this).attr('id'); //this would give me the td id but I want its child div's id
});

我的HTML就像：

<table id='myTable'>
  <tr>foo</tr>
  <tr>bar</tr>
    <td>foo</td>
    <td class='theCell'>
      <div id='myDiv'>foo</div>
    </td>
  <tr>foo</tr>
  <tr>bar</tr>
</table>

有人知道这样做的好方法吗？提前谢谢。

Answer 1

试试这个

$("td.theCell").each(function() {
  var id = $(this).find('div').attr('id'); 
});

您需要获取div的 Id 而不是td.thecell元素。因此，您需要使用.find()选择其中的潜水..

Answer 2

将所有div ID保存在数组中。使用.each jsfiddle

var dividlist = [];
$("td.theCell div").each(function() {
     dividlist.push(this.id);
});

Answer 3

您也可以直接选择子div而不使用find：

$("td.theCell div").each(function() {    
      var id = this.id
});

Answer 4

使用find获取后代div：

$("td.theCell").each(function() {
  var id = $(this).find('div').attr('id'); 
});

Answer 5

您可以通过选择器中的一个小改动来实现

$("#myTable tr > td.theCell > div").each(function() {//you can remove the '>' if you don't just want the direct children only 
  var k = $(this).attr('id'); 
  console.log(k);
});

使用jquery遍历html表行以获取单元格内的div id

5 个答案: