1

jQueryで祖先をトラバースするにはどうすればよいですか?

現在のコードは再帰ループに陥っています:

HTML:

<html>
    <body>
        <div>
            <ul>
                <li></li>
            </ul>
        </div>
    </body>
</html>

JS:

function traverse($node){
  while ( $node.get(0) !== $("html").get(0) ) {
    console.log($node);
    traverse($node.parent());
  }

}

//traverse($("ul li"));

問題を観察するには、最後の行のコメントを外してください。ただし、ブラウザがフリーズする可能性があることに注意してください。

JSFiddleでも同じ: http://jsfiddle.net/WpvJN/1/

4

2 に答える 2

5

コレクションを取得して、次のよう.parents()に繰り返すことができ.each()ます。

$('ul li').parents().each(function () {
    console.log(this);
});
于 2012-11-14T00:34:44.833 に答える
0

探している親が開始した場所の祖先でない場合に備えて、トラバースに制限を設ける必要があると思います。そうしないと、無限ループに陥るか、親が不足してしまいます。

たとえば、要素から特定のタグ名を持つ親に移動する汎用関数は、次のように実行できます (jQuery ではありませんが、必要に応じて変換できると確信しています)。

function upTo(tagName, el) {
  tagName = tagName.toLowerCase();

  // Make sure el is defined on each loop
  while (el && el.tagName && el.tagName.toLowerCase() != tagName) {
    el = el.parentNode;
  }
  return el;
}

別の方法は、チェックしてel.parentNode、それ以上ない場合に停止することです。

HTML ドキュメントには常に HTML ノードが存在するため、ドキュメント ノードから開始しない限り、常にそこにたどり着きます。

于 2012-11-14T01:26:08.363 に答える