web-dev-qa-db-ja.com

jqueryなしの.parents()-または親のquerySelectorAll

重複の可能性:
matchSelector jsでevent.target.parentElementをチェック

私はdomオブジェクトを持っています。その親、すべての親をquerySelectAll()などのセレクターと照合しますが、子ではなく親を照合します。 jQueryの.parents('selector')メソッドに似ていますが、下位互換性は必要ありません。また、ライブラリはご利用いただけません。ブール値の戻り値を取得します。

matchesSelector()を使用して、自分自身を再帰的な関数として、///の間に書くことができます。あまり知られていない方法やより効率的なコードを探しています。

処理を保存することには価値があります。何万もの一致チェック、あるいはそれ以上のことを考えてください。

16
Randy Hall

私がナイスガイだからだ!将来的には、常に質問にコードが含まれていることを確認してください。そうしないと、コードがクローズ/ダウン投票される可能性が高くなります:/

ただし、親の正確な数がわからないため、while()ループを使用することをお勧めします。

jsFiddle Demo

function getParents(el, parentSelector /* optional */) {

    // If no parentSelector defined will bubble up all the way to *document*
    if (parentSelector === undefined) {
        parentSelector = document;
    }

    var parents = [];
    var p = el.parentNode;

    while (p !== parentSelector) {
        var o = p;
        parents.Push(o);
        p = o.parentNode;
    }
    parents.Push(parentSelector); // Push that parentSelector you wanted to stop at

    return parents;
}

使用法:「親」の配列を返します

// 2nd param optional, bubbles up to document
getParents( document.getElementById('me') ); 

// get all parents starting from -me- up to ID -outerParent-
getParents( document.getElementById('me'), document.getElementById('outerParent') );