18

同じクラス名を共有するサブメニューがたくさんあるコードがあります。

構造は次のとおりです。

.menu
  .sub-menu
  .sub-menu
    .sub-menu
    .sub-menu
  .sub-menu
    .sub-menu
      .elem
      .elem
  .sub-menu

.sub-menu無限のレベルの深さである可能性があることに注意してください。

では、どうすればこれを実現できますか。.elemクリックすると、最上部に.sub-menu到達するまでDOMを上方向にトラバースし、スタイルを適用します。私は.closest()and.parent()とを知っ.find()ていますが、jQueryにそのような機能があるかどうかはわかりませ.topMost(selector)ん。

私が考えることができる唯一の方法は、ループを実行し.closest('.sub-menu')、長さがゼロになるまで新しい要素を通過することです（このクラスの親はもう存在しないため、最上位である必要があります）。ただし、これにはもっと実用的なアプローチが必要だと思います。

4

4 に答える 4

31

のように少し誤解を招く質問です。closest() は誤解される可能性があります。実際には、最初の一致が見つかるまでツリーを検索することを意味します。その反対は、一致が見つかるまでツリーを下方向に検索することであり、そのメソッドはfirst().

すべての子孫を見つけるには、 を使用できますfind()。の反対はfind()ですparents()。

closest() (すべてのレベル) セット内の各要素について、要素自体をテストし、DOM ツリー内のその祖先をたどることによって、セレクタに一致する最初の要素を取得します。

first() (すべてのレベル) 一致した要素のセットをセットの最初の要素に減らします

parent() (すべてのレベル) 一致する要素の現在のセット内の各要素の祖先を取得します。オプションでセレクターによってフィルター処理されます。

parent() (次のレベルのみ) 一致する要素の現在のセット内の各要素の親を取得します。オプションでセレクターによってフィルター処理されます。

find() (すべてのレベル) セレクター、jQuery オブジェクト、または要素によってフィルター処理された、一致する要素の現在のセット内の各要素の子孫を取得します。

于 2013-06-13T18:44:02.220 に答える
29

「最も近いの反対」で「最も遠い」親要素が必要であると仮定すると、次のparents().last()ようにを使用できます。

$('.elem').click(function() {
    var $topSubMenu = $(this).parents('.sub-menu').last();
});

jQuery が DOM をトラバースするとき、配列の最後の要素が必要なので、トップレベルのアイテムがコレクションの最後の要素になることに注意してください。

于 2013-02-09T11:29:10.830 に答える