それマグで!

知識はカップより、マグでゆっくり頂きます。 takuya_1stのブログ

習慣に早くから配慮した者は、 おそらく人生の実りも大きい。

jQuery でHTMLElementを取り出す(方法がブラウザごとに異なるかも)

jQuery を使っていると,HTMLElementはほとんど使わないので,存在を忘れそうになります.しかし、たまに元要素を参照して値を見たい!と思うときやEventをAddしたいと思うときがあります.

元HTML要素を取得する方法

jquery#get を使います
jQuery("#menu").get() //=> セレクトされた要素が入った配列。一つでも配列に入れて返す
jQuery("#menu").get(0)//一つ目 

とココまで書いて終わりだったんですが,

事件発生

ブラウザごとにjQuery の挙動が違うんです
ブラウザごとにjQueryの結果の表示が違います.

まとめると

|ブラウザ|$(セレクタ)の戻り値|HTMLElementを取るには|
|chrome | HTMLElement| そのままで取得可能|
|firefox|HTMLElement| そのままで取得可能|
|safari |jQuery Object(HTMLElement)| get()経由で取得可能|
|opera |jQuery Object(HTMLElement)| get()経由で取得可能|

つまりget を使うべきは

safari/operaだけらしい.*1

配列のふりをしたObjectだった

id:edvakf さん、突然質問してすいませんでした.ありがとうございます。
なんかパニックになっててid:edvakfさんに何ででしょうねと聞いてみたら,親切に一緒に考えてくださいました.


jQueryが配列のふりをしたObjectを返している.

FireBugChromeは配列と同等と考え配列の中身を表示している
SafariOperajQueryをオブジェクトと考えObjectとして表示している

safariもobjectと表示されているが配列として扱える


id:edvakfさん感謝です.



たしかに昔のjQueryは、オブジェクトを返していたと思うんです.

ナナピはGoogleホスティングしているjQuery を利用している。

考えられる原因は三つあって

  • Googleがブラウザごとに違いのあるjQueryを返すのか
  • ブラウザごとにjQueryが自分の挙動を変えるのか
  • ブラウザのJavaScriptの動作に起因するのか

僕は3番目だと思うんだけど,GooglejQuery をブラウザごとに異なるモノを送ってるとしたらやだなぁ.

時間があれば調べたい.

*1:あ、IEは無視です。