jQuery筛选表格行后如何修改同行列的内容？

嘿，我明白你遇到的问题了！你当前代码的问题在于：你筛选到的是.row-col-1这个<td>元素，然后用.find('.row-col-2')是在这个<td>的子元素里查找，但.row-col-2其实是它的同级兄弟元素，自然找不到啦。

给你几个可行的解决方案，按需选择就行：

方案1：用siblings()直接找同级元素 #

siblings()方法可以获取当前元素的所有同级兄弟节点，加上选择器就能精准定位到.row-col-2：

$('#table-body').find('.row-col-1').filter(function() {
  return $(this).text() === 'BABY';
}).siblings('.row-col-2').text('SHARK');

方案2：先找父级<tr>再定位目标列 #

如果你的表格结构可能有变化，这种方法更稳妥——先通过closest('tr')找到当前单元格所在的行，再在该行里查找目标列：

$('#table-body').find('.row-col-1').filter(function() {
  return $(this).text() === 'BABY';
}).closest('tr').find('.row-col-2').text('SHARK');

方案3：用next()直接定位下一个兄弟元素 #

如果.row-col-2永远是.row-col-1的下一个<td>，可以直接用next()方法，代码更简洁：

$('#table-body').find('.row-col-1').filter(function() {
  return $(this).text() === 'BABY';
}).next('.row-col-2').text('SHARK');

这三种方法都能帮你成功修改同行.row-col-2的内容，选最适合你场景的就行～

内容的提问来源于stack exchange，提问作者keisaac