HOME>WEBプログラム覚書>jQueryオブジェクト

jQueryオブジェクト

jQuery1.3もリリースされたしってことで 今さらながらjQueryの勉強してるわけですが $()で取得できるjQueryオブジェクトが気になりました。

なんでかってーと「 jQuery.eq(n) 」の機能をうまく文章にできなかったからです。 どーでもいい理由ですが調べてみたらいい勉強になりました。

jQueryオブジェクトの気になるところ

気になっていたことと答えは下記ページにありました。

DOM では document.getElementById("id") と document.getElementsByTagName("element-name") で返ってくるオブジェクトはそれぞれノードとノードリストであり、まったく性質の異なるものです。それに対して、jQuery では jQuery("#id") と jQuery("element-name") で返ってくるのはいずれも同じ性質の jQuery オブジェクトであり、違いといえば前者の (配列としての) 要素数が最大で 1 であるのに対し、後者の要素数、すなわち length プロパティの値は 2 以上になりうることぐらいです。

Roppongi.JS #1

$()で取得したjQueryオブジェクトは1個でも複数でも配列みたいな感じってことらしい。 getElementById()とgetElementsByTagName()のように返ってくるオブジェクトが異なると 当然メソッドも違うので何が返ってくるかを意識しないとダメですが$()ではそれがないと。

なるほどこりゃ便利だw

jQueryオブジェクトの次に気になるところ

次に疑問に思ったのがjQuery("element-name")で取得したものはjQueryオブジェクトなのかそれともDOMなのか?

サンプルコード

Javascript

  1. $("#execute").click(function(){
  2.     alert($("li")[0]);
  3. });
  4.  

HTML

  1. <input type="button" value="jQueryオブジェクトの中身" id="execute" />
  2.  

実行結果

なるほど。DOMですね。 全てjQueryオブジェクトに変換してたら重くなりそうですもんね。 当然っちゃ当然なのかも。

jQuery.eq(n)とかは使ったときにjQueryが持ってる n番目のDOMをjQueryオブジェクトとして返すってことか。

これでjQuery.eq(n)の説明ができそう。

jQuery.eq(n)

jQueryオブジェクトが持つn番目のDOMをjQueryオブジェクトとして返す。

だいたいあってるとおもう・・・w

jQueryオブジェクトの中身

ついでなんでjQueryオブジェクトの中身を見ておこうかと思います。

サンプルコード

Javascript

  1. var a = $("li");
  2. var t;
  3.  
  4. for (var b in a) {
  5.     t += '<span class="bold">' + b + "</span> =" + a[b] + "<br /><br />";
  6. }
  7.  
  8. $("#jQueryObject").html(t);
  9.  

HTML

  1. <div id="jQueryObject">
  2. </div>
  3.  

実行結果

投稿日 2009年1月27日 22:13
カテゴリ JavaScript
タグ jQuery | ライブラリ
トラックバック URL http://www.kantenna.com/cgi-bin/mt504/mt-tb.cgi/1147

コメント

コメントする
Name
Email Address
URL