如何选择匹配选择器的第一个祖先？

如何选择在jQuery的元素的第一个匹配的祖先？

例：

把这个HTML块

<table> 
    <tbody> 
     <tr> 
      <td> 
       <a href="#" class="remove">Remove</a> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <a href="#" class="remove">Remove</a> 
      </td> 
     </tr> 
    </tbody> 
</table>

我可以通过点击删除表中的行 “删除” 使用此jQuery代码：

$('.remove').click(function(){ 
    $(this).parent().parent().hide(); 
    return false; 
});

该作品，但它非常脆弱。如果有人放<a>成<div>，例如，它会打破。有jQuery中遵循这样的逻辑选择语法：

“这是一个元素，现在发现符合一些选择标准的最近的祖先并返回”

感谢

来源

2010-05-19 Zach

这将是closest：

$(this).closest('tr').hide();

来源

2010-05-19 15:39:14 Kobi

我会接受这个答案时，SO让我。你太快了。感谢 – Zach 2010-05-19 15:43:51

您可以选择传递给家长的说法，我相信。

$('.remove').click(function(){ 
    $(this).parents("tr:first").hide(); 
    return false; 
});

或者您可以使用最接近的，如其他答案所示。

$('.remove').click(function(){ 
    $(this).closest("tr").hide(); 
    return false; 
});

来源

2010-05-19 15:40:18 Gabriel

没有，'parent'只着眼于眼前的父母，而不是所有的祖先。 – interjay 2010-05-19 15:44:21

'parent'遍历了DOM树的一个级别，你需要用'parents'代替。另外，过滤器表达式应该是'tr：first'（无空格）。 – karim79 2010-05-19 15:45:04

@ karim谢谢，当我回答时没有咖啡。修改以反映。 – Gabriel 2010-05-19 16:26:02

我更喜欢使用closest作为@Kobi指出的（+1），因为它似乎是这样做的最简洁的方式。只是想指出，你也可以使用parents：

$(this).parents("tr:first")

来源

2010-05-19 15:44:00 karim79

不错的选择。因为'parents（）'（不像'closest（）'）返回* multiple *元素 - 所有来自父代的匹配元素都向上，所以我刚刚在选择器中发现了'：first'位。 – Dunc 2015-10-02 10:14:56

假设你正在使用jQuery 1.4，你可以使用.parentsUntil()将返回所有的祖先高达但是不包括所选择的祖先。

所以你的情况我会去像这样的东西：

$('.remove').click(function(){ 
    $(this).parentsUntil("tr").parent().hide(); 
    return false; 
});

来源

2010-05-19 16:13:49 Dave

如何选择匹配选择器的第一个祖先？

回答

相关问题