如何使用jQuery选择第一个父级DIV？

95

var classes = $(this).attr('class').split(' '); // this gets the current element classes

var classes = $(this).parent().attr('class').split(' '); // this gets the parent classes.

在上述情况下的父母是ankor。

如果我想获得$（this）的第一个父级DIV，代码将是什么样？

var classes = $(this).div:parent().attr('class').split(' '); // just a quick try.

*基本上，我想获取$（this）的第一个父级DIV的类。

谢谢

javascript jquery css-selectors

— 亚当
source

161

用于.closest()向上移动DOM树直到指定的选择器。

var classes = $(this).parent().closest('div').attr('class').split(' '); // this gets the parent classes.

— 棚架
source

10

parents("div")正在遍历并返回所有父div，您应.eq(0)在此之后使用它以确保它仅返回您想要的父div

— meo

3

请记住，使用性能更好.parents('div').eq(0)-使用由jQuery跟随的钱包CSS选择器来过滤到第一个元素，将使您稍微提高性能-请参见jQuery

— Noah Whitmore

@NoahWhitmore修复它。使用closest()它，因此除div父级外，它不会返回所有父级。

— Shef

41

Use .closest()，它获取与给定选择器匹配的第一个祖先元素'div'：

var classes = $(this).closest('div').attr('class').split(' ');

编辑：

如@Shef所述，.closest()如果当前元素也恰好是DIV ，则将返回当前元素。要考虑到这一点，.parent()请先使用：

var classes = $(this).parent().closest('div').attr('class').split(' ');

— 塔图·乌尔曼嫩（Tatu Ulmanen）
source

5

.closest()如果$(this)是DIV元素，则将匹配自身。

— Shef，2011年

@Shef，对我来说这是新信息，谢谢。我已经修改了答案以反映这一点。

— 塔图·乌尔曼嫩

3

您可以简单地使用.parents("div").eq(0)

— meo

8

如果它是一个div，它将成为父对象。然后上课。

var div = $(this).parent("div");
var _class = div.attr("class");

— 埃斯本
source

1

@meo这就是问题所在。

— 丹尼尔·韦斯特

3

把事情简单化！

var classes = $(this).parent('div').attr('class');

— 丹尼尔·韦斯特
source

0

最好的两个选择是

$(this).parent("div:first")

$(this).parent().closest('div')

当然，您可以通过

$(this).parent("div:first").attr("class")

$(this).parent().closest('div').attr("class")

— 朱纳德·马苏德（Junaid Masood）
source