jquery - find() ステートメントの jquery 短縮形

Question

次のようなことをする代わりに、非常に簡単な質問があります。

$(".one").click(function() {
    $(this).find('.two').find('.three').css...
});

このHTMLで：

<div class="one">
  <div class="two">
    <div class="three"></div>
  </div>
</div>

何らかの方法で検索という単語をスキップできる省略形はありますか?

Answer 1

$('#one #two #three')

ただしID、ページ内は一意である必要があることに注意してください

それで$('#three').css()十分なはずです

class要素が要素または要素のいずれかである場合、それは理にかなっていますtagNames

$('.one .two .three') <--
$('div span p')       <--  These are fine

これらすべてが機能するはずです

// Using find to target the class
$(this).find('.two').find('.three').css('border', '1px dashed red');
// Using find to target the class
$(this).find('.two .three').css('border', '1px dashed red');
// Using the this context
$('.two .three',this).css('border', '1px dashed red');
// Using the this context and immediate children
$('> .two > .three',this).css('border', '1px dashed red');

>直接の子のみを取得します。他の2つはthisコンテキストとして使用しています

フィドルをチェック

Answer 2

セレクタ コンテキストhttp://api.jquery.com/jQuery/#jQuery1を使用します。

$(".one").on('click', function() {
    $('.three', this).css...
});

それを実行する最も簡単な方法です。

---

また

$(".one").click(function() {
    $(this).find('.three').css...
});

すべてのステップをトラバースする必要はありません。