查找 jQuery object 是否包含在另一个 jQuery object 中

Question

假设我有一些 jQuery 运行如下：

var myVar1 = $('.myClass1, .myClass2');
myFunction(myVar1); // Does something to element myVar1

var myVar2 = $('#myId').parent();
myFunction(myVar2); // Does something to element myVar2

问题来了。有时 #myId 的 parent 将是它自己的元素，但有时它也会有 class .myClass1 或 .myClass2。但是，我不想在 #myId 的 parent 上运行 myFunction() 两次。

所以 html 可以是这样的：

<div class="myClass1"></div>
<div class="myClass1"></div>
<div class="myClass2"></div>
<div>    
    <div id="myId"></div>
</div>

或者可以这样：

<div class="myClass1">
    <div id="myId"></div>
</div>
<div class="myClass1"></div>
<div class="myClass2"></div>

jQuery 只需要在每个 <div> 上调用函数一次。

如何检测 myVar2 是否包含在 myVar1 中？

Answer 1

您可以使用 jQuery not selector 执行此操作，它会从集合中删除匹配的元素。要修改您的示例：

var one = $('.myClass1, .myClass2');
myFunction(one); // Does something to element myVar1

var two = $('#myId').not(one).parent();
myFunction(two); // Does something to element myVar2

对第二个选择的修改将使 #myId 只有在元素不具有 .myClass1 或 .myClass2class附上

Answer 2

引用你的话，

How do I detect if myVar2 is contained within myVar1?

您的每个变量都是 returning 一个 jQuery 对象，这当然很棒。如果你想知道一个 jQuery 对象在其 returned 集合中是否包含另一个 jQuery 对象，你可以 use jQuery's index() method.

来自 index():

If .index() is called on a collection of elements and a DOM element or jQuery object is passed in, .index() returns an integer indicating the position of the passed element relative to the original collection.

所以我们知道我们可以合理地得到一个等于或大于零的数字来表示另一个 jQuery 对象的索引，如果它存在于 myVar1 中，否则我们得到 -1 如果它不存在。

如果var myVar2 = $('#myId').parent();包含在var myVar1 = $('.myClass1, .myClass2')中，那么运行myVar1.index(myVar2)将return一个大于等于0的数。否则-1。

希望对您有所帮助！

查找 jQuery object 是否包含在另一个 jQuery object 中

Find whether jQuery object is included inside another jQuery object

javascript

jquery

javascript-objects