Как выбрать первый родительский DIV с помощью jQuery?

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.

Родитель в приведенной выше ситуации - анкор.

Если бы я хотел получить первый родительский DIV для $ (this), как бы выглядел код?

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

* В основном я хочу получить классы первого родительского DIV $ (this).

Спасибо

javascript jquery css-selectors Адам
источник

Ответы:

161

Используется .closest()для перехода вверх по дереву DOM до указанного селектора.

var classes = $(this).parent().closest('div').attr('class').split(' '); // this gets the parent classes.
Шеф
источник
10
parents("div")проходит и возвращает все родительские div, которые вы должны использовать .eq(0)после него, чтобы убедиться, что он возвращает только тот, который вам нужен
meo
3
Помните, что лучше использовать для повышения производительности .parents('div').eq(0)- использование этого селектора CSS кошелька, СЛЕДУЮЩЕГО jQuery для фильтрации только первого элемента, даст вам небольшое повышение производительности - см. Раздел «Дополнительные примечания» в jQuery: eq doc
Ноа Уитмор
@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(' ');
Тату Улманен
источник
5
.closest()будет соответствовать самому себе, если $(this)является элементом DIV.
Shef
@Shef, это была для меня новость, спасибо. Я отредактировал свой ответ, чтобы отразить это.
Тату Улманен
3
вы могли бы просто использовать.parents("div").eq(0)
meo
8

Это получает родительский элемент, если это div. Тогда это станет классом.

var div = $(this).parent("div");
var _class = div.attr("class");
Эсбен
источник
1
@meo Вот что задал вопрос.
Daniel West
3

Будь проще!

var classes = $(this).parent('div').attr('class');
Дэниел Уэст
источник
0

два из лучших вариантов

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

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

и, конечно, вы можете найти атрибут класса по

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

$(this).parent().closest('div').attr("class")
Джунаид Масуд
источник