jQueryで要素の操作に欠かせないもの・・・それがjQueryオブジェクトです。

これがあるからこそ要素の操作が簡単になる訳ですが、気を付けないといけないことがあります。

それは空かどうかを判定するのに  null  や  undefined  は使えない、ということ

ということでここではjQueryオブジェクトが空かどうか調べる正しい方法について紹介します。

そもそもjQueryオブジェクトとはなにか

まずjQueryオブジェクトってそもそもなんなの？

という話ですがこれはjQueryでJavaScriptのノード要素を扱いやすくしたものです。

これはjQueryを使っているとあらゆる場面で使われています。

例えば次のようにセレクタとかHTMLから要素オブジェクトを取得したり、

jQueryの  find  とか  next  とかの検索系関数で見つけ出した要素として返されたり、

あるいは要素のプロパティを操作する関数の返り値として返されたりなどなど・・・

こういう風にjQueryを使っていると意識せずとも使うことになるのがjQueryオブジェクトなのです。

jQueryオブジェクトが空か調べるのに間違った方法

jQueryオブジェクトが空(中身がない)がどうか調べるのに間違った方法・・・

それは  null  や  undefined  と比較して調べてしまうことです。

例えば次が間違った比較のコード例

そもそもjQuery関数から返されるjQueryオブジェクトは  null  にも  undefined  にもなりません。

なので上のコードのように比較してしまうのは全部間違っています。

あと当然ながらjQueryオブジェクトそのものを評価してもいけません。

たとえ中身が空の状態であってもjQueryオブジェクト自体は存在します。

つまりここまでの説明をまとめると

（ jQueryオブジェクトが空であること ）というのは
（ null値を持つ ）あるいは（ 定義されていない つまり undefined ）とは全く別者

ということです。

両者を比較するというのはナンセンスで全く意味がありません。

jQueryオブジェクトの空判定をする正しい方法

ではどうすれば正しくjQueryオブジェクトが空かどうか判定できるか・・・

その方法には色々やり方があってそれが次の２つ

• size関数またはlengthプロパティが0か調べる
• オブジェクト内のノード要素がundefineかどうか調べる

それぞれのやり方は次の通りです。

まずは１つめはsize関数またはlengthプロパティが 0 になっているかどうかで調べる方法

次がそのコード例

size関数はjQueryオブジェクトの関数でlengthプロパティを同じ値を返します。

そしてオブジェクト内の要素数が0なら中身がないと分かるので空判定ができるという訳です。

そしてもう１つはjQueryオブジェクト内のノード要素が  undefined  か調べる方法

まずjQueryオブジェクトではノード要素に配列形式でもアクセスできます。

なので次のようにすれば１番目のノード要素が取得可能

つまりこれを利用して１番目の要素があるかどうかで空判定ができます。

例えば次がノード要素が  undefined  かどうかで空判定するコード例

jQueryオブジェクトが空でないなら  elem[0]  は必ず  undefined  以外になるのでそれを利用しています。

ということで今までの判定方法をまとめてコードにすると次の通り

見た目的には最後のノード要素を使う方法が一番スマートですね。

もし他人のソースコードに  elem[0]  とか書かれていたら空判定しているのだと思いましょう。

ここまでのまとめ

ということでjQueryオブジェクトを空判定する方法をもう一度まとめておきます。

• size関数またはlengthプロパティが0か調べる
  elem.size( ) !== 0  または  elem.length !== 0  が  false  になればjQueryオブジェクトは空
• オブジェクト内のノード要素がundefineかどうか調べる
  elem[0]  のように１番目にアクセスして  undefined  ならjQueryオブジェクトが空

個人的にはノード要素を使って空判定するのがコードも少なくて楽な方法だと思います。

ではでは･△･)ﾉ ﾊﾞｲﾊﾞｲ