javascript - 現在の要素が要素の末っ子/孫/孫であるかどうかを検出します

Question

fragクラスに属するスパン要素をループしています。frag現在フラグ要素が、クラスに属し、クラスに属しcond、「if」または「else if」を持つスパン要素の末っ子/孫/孫（左から右）であるかどうかを検出したかったそのテキストで

contenteditable div (テキストエリア)

if( ((b>0) && (b<10)) || b==15 )

HTML 同等物

<div id="board">
  <div>
  <span class="frag cond">if<span class="openParen bm1">(</span> <span class="frag cond"><span class="openParen bm2">(</span><span class="frag cond"><span class="openParen bm3">(</span><span class="frag">b</span>&gt;0<span class="closeParen bm3">)</span></span> && <span class="frag cond"><span class="openParen bm4">(</span><span class="frag">b</span>&lt;10<span class="closeParen bm4">)</span></span><span class="closeParen bm2">)</span></span> || <span class="frag">b</span>==15 <span class="closeParen bm1">)</span></span>
  </div>
</div>

（ちなみに私のシステムはコードエディターのようなものなので、contenteditable divを使用しています）ここで、私が3番目にあるかどうかを検出したかったのbです。

byossarianはこれで私を助けてくれました:

var $elem = $('.frag').eq(fragNum);

var validAncest = $elem.parents('.cond').filter(function(i){
    return /^\s*(if|else\s+if)/.test($(this).text());
}).filter(function(i){
    var generations = 0,
    $elemCrawl = $('.frag').eq(fragNum);

    while ($elemCrawl[0] && $elemCrawl[0] !== this) {
        generations++;
        $elemCrawl = $elemCrawl.parent();
    }

    if ($elemCrawl[0] && generations < 4) {
        return true;
    }
});

要素のすべての祖先を検索し、次に一度フィルタリングして、'if' または 'else if' で始まるものに絞り込みます。次に、これらを元の要素の親、祖父母、または曾祖父母 (世代 < 4) のいずれかにフィルター処理します。

チェックする条件は次のとおりです。

if (validAncest.length && !$elem.nextAll('.frag').length) {
    alert('target acquired');
}

少なくとも 1 つの有効な祖先 (validAncest.length) が存在し、元の​​要素がクラス「frag」を持つIMMEDIATE 親の最後の子であることを確認します (!$elem.nextAll('.frag').length)

問題

IMMEDIATE 親は、「if」または「else if」を持つ要素の最後の子/孫でもある必要があります

したがって、上記の例から、最初のものbはすでに3番目にあるはずのアラートを私に与えますb

UPDATEbは、2番目ではなく2番目にアラートをポップする必要があります(b<10)