如何 select 第一个 td 与点击的 td 相比

Question

如果选择器像这样<tr>应该很容易$('tr')，但我的目标是td。例如单击此处或 td 2 等。我想将第一个 td 的内容与单击的 td 进行比较。也就是说在这种情况下 td 1.

//And this is my jQuery code with <tr> .. what about if a select was a <td> ? 
$('tr').on('click', function() {
  var tds = $('td:first-child', this).text();
  alert(tds);
});

//After having documented I found this but that did not help :( 
var td1 = $(this).closest('td.id').prev('').text();
alert(td1);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="id"> td 1 </td>
    <td> td 2 </td>
    <td> td 3 </td>
    <td> CLICK HERE </td>
  </tr>
</table>

提前致谢

Answer 1

要获得任何单击行的第一个 td，请使用 :first 选择器，如下所示：

$('tr').on('click', function() {
  var tds = $(this).find('td:first').text();
});

或者，如果 click 事件绑定到 td 本身，使用 closest() 获取父 tr，然后找到第一个 td:

$('td').on('click', function() {
  var tds = $(this).closest('tr').find('td:first').text();
});

Answer 2

您可以使用 jQuerys parent() and children() 函数：

$('td').on('click',function()
  {
     var tr = $(this).parent();
     var tds = tr.children();
     var first_td = tds[0];
     var text = $(first_td).text();
     alert(text);
  });

如何 select 第一个 td 与点击的 td 相比

How to select first td compared to the clicked td

javascript

jquery

jquery-selectors