0

以下に示すような HTMLがあり、クラス#topを持つ要素の子孫を検索したいとします。fooただし、見つけた他の要素のサブ要素ではない要素のみを見つけたいと思います。つまり、通常は要素を再帰的に検索したいのですが、foo要素に再帰したくありませんfoo

<div class="foo" id="top">
    <div class="bar">
        <div class="foo"> <!-- Find this !-->
        </div>
    </div>
    <div class="foo"> <!-- Find this !-->
        <div class="foo"> <!-- Do not find this, because we already found parent !-->
        </div>
    </div>
</div>

Javascript/jQueryを使用してこれを行うにはどうすればよいですか?

編集:これにはいくつかの混乱がありました。上記の例は問題を説明するためのものですが、一般的な解決策で解決する必要があるすべてのエッジ ケースをカプセル化するわけではないため、ここのフィドルでより複雑な例を作成しました: http://jsfiddle.net/JQNyW/ 1/

4

3 に答える 3

1

このような?

$('#top').find('.foo').filter(function () { // while selecting ignore parent which also has foo
    return $(this).parents('.foo').length == 1; //length is 1 since the #top also has foo
});

フィドル

または

$('#top').find('.foo').filter(function () {
    return $(this).parents('.foo:not("#top")').length == 0
}).css('color', 'red');
于 2013-06-28T21:46:48.550 に答える
0

私はおそらく children() または find() を別々に使用します。これは、子供の子供にアクセスするためにチェーンする必要がなく、次のように、よりクリーンで最適化され、処理が高速になるためです。

 $('#top').children('.foo').attr('this','yeah');

 $('#top').find('> .foo',this).attr('child','yes');

コンソールを見て、att() を最初の要素にのみ追加します。

必要に応じて、jQuery のドキュメントを参照してください。

http://api.jquery.com/find/

http://api.jquery.com/children/

お役に立てれば。

于 2013-06-28T21:49:58.737 に答える