Как выбрать элемент из объекта jQuery?

Question

Скажем, у меня есть следующий код:

<div class="foo"> 
    <div class="t1">A</div> 
    <div class="t2">B</div> 
</div> 

//JS 

var obj = $('.foo'); 

Теперь я хочу, чтобы получить текст из t2 элемента. Как выбрать это, используя мой объект obj?

Это делает не работы: var txt = $(obj + '.t2').text();
Это прекрасно работает: var txt = obj.find('.t2').text();
Я также знаю, что могу использовать этот var txt = $('.foo .t2').text();

Но я имею в виду, что использование .find() требует больше ресурсов, чем выбрать его непосредственно. Есть ли способ, которым я могу выбрать дочерний элемент напрямую, используя мой obj?

Answer 1

Принимая это попытка в то время:

var txt = $(obj + '.t2').text(); 

Это не работает, потому что вы пытаетесь добавить строку в объект, результат которого не будет действительным селектор.

var txt = obj.find('.t2').text(); 

Это будет выглядеть для .t2 элемента в пределах кэшированного подмножества элементов в исходном селекторе. Это самый лучший способ, чтобы использовать для вашего сценария и фактически использует меньше ресурсов, чем в примере 3:

var txt = $('.foo .t2').text(); 

, который также будет работать, однако это потребует JQuery, чтобы снова сканировать DOM, который является то, что следует избегать возможное.

Answer 2

Вы можете попробовать

obj.children().eq(1).text() 

Таким образом, вы получаете доступ к детям вашей obj переменного, возьмите (на основе индекса 0) второй и получить доступ к его тексту.

Answer 3

Если ваше состояние в том, что вы должны пройти через свой элемент obj, тогда я считаю, что find() - это путь. Я не видел ничего в документации jQuery по find() относительно того, насколько эффективен против прямого селектора, но я думаю, что факт, что вы ищете только потомков вашего obj с find(), означает, что он не может быть слишком неэффективным.

obj.find('.t2').text() 

Answer 4

Самый прямой путь, чтобы выбрать детей было бы получить все дети, и доступ к ним по индексу:

var ch = obj.children(); 
var text = ch.eq(1).text(); 

Это, естественно, означает, что вы должны знать порядок дочерних элементов.

Вы можете использовать селектор в children method. Это поможет детям, который соответствует селектор, но единственное отличие от использования find является то, что он ищет только непосредственных детей, так что в вашем случае это работает точно так же:

var text = obj.children('.t2').text();