jQueryオブジェクトの等価性


151

2つのjQueryオブジェクトが等しいかどうかをどのように判断しますか?特定のjQueryオブジェクトの配列を検索できるようにしたいと思います。

$.inArray(jqobj, my_array);//-1    
alert($("#deviceTypeRoot") == $("#deviceTypeRoot"));//False
alert($("#deviceTypeRoot") === $("#deviceTypeRoot"));//False

回答:


225

jQuery 1.6以降、を使用できます.is。以下は1年以上前の回答です...

var a = $('#foo');
var b = a;


if (a.is(b)) {
    // the same object!
}

2つの変数が実際に同じオブジェクトであるかどうかを確認する場合は、次のようにします。

var a = $('#foo');
var b = a;

...その後、それらの一意のIDを確認できます。新しいjQueryオブジェクトを作成するたびに、IDを取得します。

if ($.data(a) == $.data(b)) {
    // the same object!
}

同じことは単純なa === bで実現できますが、上記は少なくとも次の開発者にあなたがテストしているものを正確に示すかもしれません。

いずれにせよ、それはおそらくあなたが望んでいることではありません。2つの異なるjQueryオブジェクトに同じ要素のセットが含まれているかどうかを確認する場合は、これを使用できます。

$.fn.equals = function(compareTo) {
  if (!compareTo || this.length != compareTo.length) {
    return false;
  }
  for (var i = 0; i < this.length; ++i) {
    if (this[i] !== compareTo[i]) {
      return false;
    }
  }
  return true;
};

ソース

var a = $('p');
var b = $('p');
if (a.equals(b)) {
    // same set
}

このソリューションは、要素が1つしかない場合にphpdeveloperによって提供されるソリューションを簡素化します。jQueryオブジェクトが等しいと見なすことができるもう1つの意味は、それらが同じセレクターとコンテキストを持っているかどうかです。これはテストするのに十分簡単です:A.selector === B.selector && A.context === B.context。多くの場合、コンテキストは常に同じであるため、セレクターのみを考慮する必要があります。
Casebash 2010

2
@Casebash-true、ただし、いくつかのセレクターが同じ結果セットになる可能性があることを考慮してください。例:$(':first')and$('*:first')
nickf

3
注意@rampionとnickf、jQuery is()は、セレクターが同一であるかどうかをチェックしませんセレクターが重複しているだけです。目撃者: jsfiddle.net/bnhkm/1
ボブスタイン

あなたのequals関数は、順番に敏感であるように思われます。遅いですが、stackoverflow.com / a / 29648479のようなものがより多くの場合に機能します。
Jayen

equals関数は、オブジェクトに1つのレベルがある場合にのみ機能します。a = b = [{dir: 'test'、sort:[{test:{test:1}}]}]の
比較

16

それでもわからない場合は、次の方法で元のオブジェクトを取得できます。

alert($("#deviceTypeRoot")[0] == $("#deviceTypeRoot")[0]); //True
alert($("#deviceTypeRoot")[0] === $("#deviceTypeRoot")[0]);//True

$("#deviceTypeRoot")セレクタが選択したオブジェクトの配列も返すからです。


1
2つのアラートが表示されますtrueあなたはDOM要素の参照を比較しているため、=====あなたに同じ結果が得られます(ないタイプの強制は必要ありません、彼らはちょうど2つのオブジェクト参照です)
CMS

2番目のステートメントは実際にはTrueを返します
Casebash 2010

ああそうだね。間違いをコピーして貼り付ける= D
mauris

14

$.fn.equals(...)解決策は、おそらく最もクリーンでエレガントなものです。

私はこのように素早く汚れたものを試しました:

JSON.stringify(a) == JSON.stringify(b)

それはおそらく高価ですが、快適なのは暗黙的に再帰的ですが、エレガントなソリューションはそうではありません。

ちょうど私の2セント。


1
これは、2つのjQueryオブジェクト間の等価性をチェックするのには適していませんが、標準オブジェクトには適しています。「{a: 'x'、b: 'y'、c: 'z'} == {a: 'x'、b: 'y'、c: 'z'}」のように。jQuery.isEqual(a、b)...がないと思います...
iRaS 2013

13
これは間違っています。オブジェクトプロパティの順序は重要です。だからあなたが持っていて{a: 1, b: 2}{b: 2, a: 1}これが戻るfalseべきときにこれが戻るでしょうtrue
エリックアルバーソン2014年

3
@EricAlberson、この状況を処理できる他の詳細比較ツールやスクリプトについて何か提案はありますか?
Neil Monroe

8

$(foo)を$(foo)と比較することは、次の比較と機能的に同等であるため、一般的には悪い考えです。

<html>
<head>
<script language='javascript'>
    function foo(bar) {
        return ({ "object": bar });
    }

    $ = foo;

    if ( $("a") == $("a") ) {
        alert ("JS engine screw-up");
    }
    else {
        alert ("Expected result");
    }

</script>

</head>
</html>

もちろん、「JSエンジンのねじ込み」を期待することはできません。「$」は、jQueryが何をしているかを明確にするために使用しています。

$( "#foo")を呼び出すたびに、実際には新しいオブジェクト返す jQuery( "#foo")を実行しています。したがって、それらを比較して同じオブジェクトを期待することは正しくありません。

ただし、できることは次のようなものです。

<html>
<head>
<script language='javascript'>
    function foo(bar) {
        return ({ "object": bar });
    }

    $ = foo;

    if ( $("a").object == $("a").object ) {
        alert ("Yep! Now it works");
    }
    else {
        alert ("This should not happen");
    }

</script>

</head>
</html>

したがって、実際のプログラムでjQueryオブジェクトのID要素を比較して、

... 
$(someIdSelector).attr("id") == $(someOtherIdSelector).attr("id")

より適切です。


1
明確にするために、jQueryにはオブジェクト属性がありません。Elf Kingはこれを疑似コードとして使用しているようです
Casebash


4

まず、この関数を使用して、キーに基づいてオブジェクトを注文します

function sortObject(o) {
    return Object.keys(o).sort().reduce((r, k) => (r[k] = o[k], r), {});
}

次に、この関数を使用して、オブジェクトの文字列化されたバージョンを比較します

function isEqualObject(a,b){
    return JSON.stringify(sortObject(a)) == JSON.stringify(sortObject(b));
}

ここに例があります

オブジェクトのキーの順序が異なり、値が同じであると仮定します

var obj1 = {"hello":"hi","world":"earth"}
var obj2 = {"world":"earth","hello":"hi"}

isEqualObject(obj1,obj2);//returns true

-1

内容が等しいかどうかを確認したい場合は、JSON.stringify(obj)を使用してください

例-var a = {key:val};

var b = {key:val};

JSON.stringify(a)== JSON.stringify(b) ----->内容が同じ場合はtrueになります。


カリームの回答のように、最初にキーをソートする必要があります
reggaeguitar
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.