Поиск конкретного родителя на определенном уровне

Question

Если у вас есть рекурсивная структура, скажем, дочерние таблицы, расположенные внутри ячеек td родительских таблиц, как лучше всего пройти / выбрать конкретную родительскую таблицу? Например, что если вы хотите найти следующую таблицу вверх или 2-ю таблицу вверх?

Одним из способов может быть поместить что-то вроде этого в цикл:

//Get the next parent up.
$parentTable = $table.parent('td,th')
    .parent('tr')
    .parent('tbody')
    .parent('table');

Но это кажется уродливым и хрупким.

Нечто подобное выглядит пугающим и, вероятно, также непредсказуемым:

$parentTable = $table.parents('table').eq(1);  // Get the 2nd parent table up.

Решено

Я убедился, что $ table.parents ('table'). Eq (N-1) действительно дает вам N-го родителя. Что касается того, почему я использую таблицы для форматирования, я, по крайней мере, не в этот раз. :) Я на самом деле отображаю рекурсивные данные, позволяя складывать их на клиенте. jQuery заставляет меня делать вещи, которые я бы даже не подумал раньше.

И кстати, использование .parent ('table') в этом случае не сработает, потому что parent () выберет только непосредственного родителя. Аналогично с child (), он выбирает только непосредственных детей. Аналог родителей () это найти (). Parents () идет вверх, а find () идет вниз. Отличный материал!

Обновление

1.3 добавил новый метод обхода, closest (), который также может быть полезен здесь. Ближайший («таблица») будет перемещаться вверх, пока не найдет ближайшую таблицу предков.

Answer 1

$table.parents('table')

Предсказуемо настолько, насколько это возможно - он даст вам обратный список родительских таблиц между начальным объектом и телом.

Если вы не можете заранее определить структуру вложенных таблиц, то обход не сработает, и вам нужно будет выбрать объекты на основе других критериев.

Answer 2

Зависит от того, насколько точным ты должен быть.

$pTable = $table.parent('table'); //get the immediate parent table
$pTable = $table.parent('table.someclass') //get the parent table w/class someclass
$pTable = $table.parents('table').eq(n) //get the #-1 parent table

Это как раз одна из причин, по которой таблицы должны использоваться только для табличных данных, а не для макетов. Вы должны быть в состоянии уверенно пройти DOM в своих приложениях.