web-dev-qa-db-ja.com

nレベル上の特定の親要素を見つけるjQueryセレクター/メソッドはありますか?

次のHTMLを検討してください。 <button>要素へのJSON参照がある場合、どちらの場合でも外側の<tr>要素への参照を取得するにはどうすればよいですか

<table id="my-table">
    <tr>
        <td>
            <button>Foo</button>
        </td>
        <td>
            <div>
                <button>Bar</button>
            </div>
        </td>
    </tr>
</table>

<script type="text/js">
    $('#table button').click(function(){
        //$(this).parent().parent() will work for the first row
        //$(this).parent().parent().parent() will work for the second row
        //is there a selector or some magic json one liner that will climb
        //the DOM tree until it hits a TR, or do I have to code this myself
        //each time?            
        //$(this).????
    });
</script>

各条件を特殊なケースにできることは知っていますが、「要素Xが見つかるまで木に登る」スタイルのソリューションに興味があります。このようなものですが、jQueryのような/より冗長なもの

var climb = function(node, str_rule){
    if($(node).is(str_rule)){
        return node;
    }
    else if($(node).is('body')){
        return false;
    }
    else{
        return climb(node.parentNode, str_rule);
    }
};  

私はparent(expr)メソッドについて知っていますが、私が見たことから、1レベル上で親をフィルタリングし、exprを見つけるまでツリーを登ることはできません(間違っていることを証明するコード例が大好きです)

49
Alan Storm

関数はあなたが望むことをします:

$(this).parents("tr:first");
97
Seb

また、jQuery 1.3+を使用している場合は、 closest メソッドを使用できます

$(this).closest("tr");
43
bendewey

jQueryではありませんが、このオプションははるかに優れています

node.contains(otherNode)

Node.contains()メソッドは、ノードが特定のノードの子孫であるかどうかを示すブール値を返します

https://developer.mozilla.org/en/docs/Web/API/Node/contains

0
zloctb