jQuery поиск нескольких уровней детей

Question

У меня есть родительский класс div, который называется common-end.

У меня есть много Div с помощью этого класса, пример того, как выглядит это:

<div class="item question common-end"> 
    <label>label</label> 
    <div> 
     <textarea name="name1" id="text1" class="deep-item form-control input-lg" rows="3"></textarea> 
    </div> 
</div> 

Не все common-end DIV нам иметь эту структуру. Могут быть несколько уровней вложенности.

Единственное, что я точно знаю, это то, что SOMEWHERE внутри common-end будет что-то с классом deep-item (в этом случае оно находится на текстовом поле).

Что селектор JQuery я могу использовать, чтобы найти deep-item SOMEWHERE внутри common-end?

Благодаря

Answer 1

Как уже упоминалось RyanW, самый простой селектор, который похож на селектор CSS:

var $deepItems = $('.common-end .deep-item'); 

Однако следует отметить, что способ JQuery работает, в этом случае, является поиск справа налево. Итак, если у вас есть .deep-item элементов, отличные от .common-end элементов (или просто имеет очень мало .common-end элементов) элементы, которые вы должны дать JQuery возможность для сферы его (что делает его немного быстрее):

var $deepItems = $('.deep-item', '.common-end') 
// equivalent to: 
var $deepItems = $('.common-end').find('.deep-item') 

Это позволяет Jquery к просто найдите все .common-end элементы сначала, затем начните поиск в пределах .deep-item (вместо поиска всего .deep-item s и подтверждения, что они вложены в .common-end).

Это не может быть большой проблемой, поскольку у вас есть специальные классы для поиска. Однако, если вы начали с класса и хватали определенный тег, это могло бы стать проблемой. Картина следующая:

$('.common-end div'); 

Что бы захватить каждый <div> на странице, а затем проверить, если это предок .common-end.

Answer 2

$('.common-end .deep-item') 

Это будет возвращать все глубоко элемента, в пределах общего конца. Если есть конкретные на вы ищете, вы можете сделать что-то, как показано ниже:

var el = $(<selector to the common-end i care about); 
var deepItem = el.find('.deep-item'); 

Answer 3

В JQuery использовать селекторы таким же образом, вы используете их в CSS.

$('.common-end > .deep-item') //this will select only direct children 
$('.common-end .deep-item') //this will select all children, even if nested under multiple levels 

Согласно вашему вопросу, вам нужен второй.