Question

我正在寻找一个jquery选择器的帮助，该选择器将在根元素下面找到所有匹配的元素，其约束条件是候选元素和根元素之间没有另一个匹配元素。

这里有一些伪html来澄清我的目标

<table id='root'>
    <tbody>
        <tr>
            <td>
                <div>
                    <!-- I want this table -->
                    <table id='A'>...</table>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div>
                    <!-- And this one -->
                    <table id='B'>
                        <tbody>
                            <tr>
                                <td>
                                    <div>
                                        <!-- But not this one, it's inside another -->
                                        <table id='C'>...</table>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </td>
        </tr>
    </tbody>
</table>

在上面的例子中，我会寻找一个选择器，它会给我表A和B，但不是C（因为表B在它和根表之间）。

编辑：为了进一步澄清，我只包括了Id，所以我可以在问题中回复他们。我不会知道我所追求的元素的id，并且会有任意数量的任意深度。

Answer 1

只需获取root中的所有表格，然后过滤掉任何没有#root作为closest()表格的表格。您必须从父级开始，因为closest()以当前元素开始，该元素也是一个表：

$('#root table').filter(function() {
    return $(this).parent().closest('table').prop('id') == 'root';
});

应该注意的是，DIV不是表的有效子项，因此它不能使用当前标记，因为它的 完全无效

Answer 2

One-liner：查找#root下的所有表格，然后删除＆＃34;孙子＆＃34;表格使用.not()：

$('#root table').not( $('#root table table'))

http://api.jquery.com/not/

Answer 3

$('#root > div > table')

这将返回所有作为div元素的直接子元素的表，该元素也是#root的直接子元素。因此，它不会返回#C，因为div父母不是#root的直接孩子

选择最近匹配的DOM元素

3 个答案: