javascript - 別の要素を持つ DIV の HTML を取得する

Question

私はたくさんのサムネイルを持っています。これらのうち、私linkは自分の JQuery スクリプトで を知っていますが、 から HTML を取得する必要がありますが、.captionそうすることができません。

私は次のことを試しました

$('a.thumbnail').click(function() {
    $(this).closest('.caption').html()
    $(this).find('.caption').html()
    $(this).children('.caption').html()
});

HTMLは次のとおりです。

<div class="thumbnail">
    <a href="#" class="thumbnail">
        <img src="{{ URL::asset($item->image) }}" alt="">
    </a>
    <div class="caption" align="center">
        {{ $item->name }}
    </div>
</div>

Answer 1

.captionはあなたの兄弟であるため、これも機能しますa。

$('a.thumbnail').click(function() {
    $(this).siblings('.caption').html();
});

あなたのものがうまくいかない理由：

$(this).closest('.caption').html() // .caption is not an ancestor of the a
$(this).find('.caption').html()  // .caption is not a descendant of the a
$(this).children('.caption').html() // .caption is not a child of the a

Answer 2

試す：

$('a.thumbnail').click(function() {
    $(this).closest('div.thumbnail').find('.caption').html();
});

jsFiddle の例

画像をクリックすると、含まれている div までトラバースするために使用する必要があり、キャプション.closest()に戻るには find を使用する必要があります。.find()

Answer 3

あなたは試すことができます：

$(this).parent().find('.caption').html();