比较jQuery中的DOM对象 [英] Comparing DOM objects in jQuery

问题描述

我已经看过其他SO帖子，似乎是同一个问题，但是他们不是。
$ b

 < table> 
< tr id =first_row> 
< td>< span id =first_span> item1< / span>< / td> 
< td>< span> item2< / span>< / td> 
< / tr> 
< tr id =second_row> 
< td>< span> item1< / span>< / td> 
< td>< span> item2< / span>< / td> 
< / tr> 
< / table> 
  

和

  jQuery（function（）{
 var $ a = $（＃first_row）; 
 var $ b = $（＃first_span）父母（tr）; 
 var $ c = $（＃second_row）; 
}）; 
  

$ a 和 $ b 是两个不同的jQuery对象，但是引用相同的DOM对象，其中 $ c 是一个不同的DOM对象，但内容相同 $ a 和 $ b 。如何比较它们，以便 $ a 等于 $ b 而不是 $ C ？谢谢。

注意：我对jQuery和DOM很新，所以希望我没有犯任何概念上的错误。请自行让我知道，如果有的话。

解决方案

比较DOM对象本身（在jQuery对象内的数组中） ）这样：

  if（$ a [0] === $ b [0]）{
 / / code当每个jQuery对象的第一个DOM对象是一样的
} 
 
或
 
 if（$ a [0] === $ c [0 ]）{
 //当每个jQuery对象的第一个DOM对象相同时的代码
} 
  

jQuery对象本身始终是单独的对象，因此您必须查看每个jQuery对象内实际DOM数组的内容。

您可以访问一个jQuery对象中的DOM对象，其中包含上面显示的数组语法，或者使用 .get（x）方法。 .get（）方法有两个额外的功能，数组语法没有。如果您没有将参数传递给 .get（），则返回整个数组。如果您传递一个负数，如 .get（-1），则返回从DOM元素数组的末尾开始计数的DOM对象，而不是从头开始计数。 p>

编辑1

如果要比较两个jQuery对象中的整个数组（可以，的数组中的DOM对象将是一样的），你可以通过编写代码来做比较：

  function jQuerySame （a，b）
 if（a.length！= b.length）{
 return（false）; 
} 
 for（var i = 0; i  if（a.get（i）！= b.get（i）{
 return（false）; 
} 
} 
 return（true）; 
} 
 
那么你可以使用：
 
 if（jQuerySame（$ a，$ b））{
 //当所有DOM元素在这两个jQuery对象中相同时，代码
} 
  

这也可以通过jQuery插件机制本身成为一个jQuery方法。

< h2>编辑2

我刚刚发现使用.filter（）方法执行此操作的另一种方法是独立且简单的。

 函数jQuerySame（a，b）{
 return（a.length === b.length&& a.length === a。过滤器（b）.length）; 
} 
  

过滤器方法可以使用一个jQuery对象因此，如果我们通过 b 对象过滤 a 对象，并获取相同数量的结果，我们开始然后每一个物体 a 必须在 b 中。如果 b 不包含 a 中的每个对象，则过滤对象的长度将会更小。在jQuery源代码中，如果将jQuery对象传递给filter（）方法，那么它只是循环遍历一个数组，另一个调用$ .inArray（），消除了第一个不在第二个的数组 - 因此为我们做我们的工作。

I have looked through the other SO posts that seem to be of the same question but they are not.

I have the following:

<table>
  <tr id="first_row">
    <td><span id="first_span">item1</span></td>
    <td><span>item2</span></td>
  </tr>
  <tr id="second_row">
    <td><span>item1</span></td>
    <td><span>item2</span></td>
  </tr>
</table>

and

jQuery(function() {
  var $a = $("#first_row");
  var $b = $("#first_span").parents("tr");
  var $c = $("#second_row");
});

$a and $b are two different jQuery objects but referring to the same DOM object, which $c is a different DOM object but of the same content as $a and $b. How do I compare them so that $a is equal to $b but not to $c? Thanks.

Note: I am fairly new to jQuery and DOM, so hope that I am not making any conceptual mistakes. Feel free to let me know, if any.

解决方案

Compare the DOM objects themselves (which are in an array inside the jQuery object) with this:

if ($a[0] === $b[0]) {
   // code for when first DOM object of each jQuery object is the same
}

or

if ($a[0] === $c[0]) {
   // code for when first DOM object of each jQuery object is the same
}

The jQuery objects themselves are always separate objects so you have to look at the contents of the actual DOM array inside each jQuery object.

You can access the DOM objects inside a jQuery object with either the array syntax shown above or with the .get(x) method. The .get() method has two additional features that the array syntax does not. If you pass no argument to .get() it returns the whole array. If you pass a negative number like .get(-1), it returns a DOM object counting from the end of the DOM element array instead of counting from the beginning.

EDIT 1

If you want to compare the whole arrays in two jQuery objects (and it's OK to assume the order of DOM objects in the array would be the same), you could do so by writing code to do that comparison:

function jQuerySame(a, b)
    if (a.length != b.length) {
        return(false);
    }
    for (var i = 0; i < a.length; i++) {
        if (a.get(i) != b.get(i) {
            return(false);
        }
    }
    return(true);
}

Then, you could use:

if (jQuerySame($a, $b)) {
    // code for when all DOM elements are the same in these two jQuery objects
}

This could also be made to be a jQuery method itself via the jQuery plug-in mechanism.

EDIT 2

I just discovered another way to do this that is order independent and simpler using the .filter() method.

function jQuerySame(a, b) {
    return(a.length === b.length && a.length === a.filter(b).length);
}

The filter method can take a jQuery object as input. So, if we filter the a object by the b object and get the same number of results we started with then every object in a must be in b. If b didn't contain every object in a, then the length of the filtered object would be smaller. In the jQuery source, if you pass a jQuery object to the filter() method, it just loops through the array of one, calling $.inArray() on the other, eliminating the ones from the first that aren't in the second - thus doing our job for us.

这篇关于比较jQuery中的DOM对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！