javascript - 如何使用jQuery在表格行下分别选择各个表格数据的文本

Question

这是代码

<tbody id="table-body">

 <tr>
      <td id="c1">AAA0</td>
      <td id="c2">2%</td>

 </tr>

</tbody>

我想选择标签下ID为c1的数据。 我正在使用这个 jQuery 代码，但它选择 < tr > 标签下的整个文本。

$("#table-body").on('click','tr',function(e){
e.preventDefault();
console.log($(this).text());
})

如果此代码，我将得到 AAA02% 作为输出。 我想分别选择AAA0和2。 怎么做？

Answer 1

由于每个单击的 tr 元素中都有多个 td 元素，因此您必须循环遍历每个元素才能单独获取文本。

您可以使用 find() 和 each()，如下所示:

$("#table-body").on('click','tr',function(e){
  $(this).find('td').each(function(){
    console.log($(this).text());
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody id="table-body">
    <tr>
      <td id="c1">AAA0</td>
      <td id="c2">2%</td>
    </tr>
  </tbody>
</table>