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

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

元HTML要素を取得する方法

jquery#get を使います

例

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

参照

http://api.jquery.com/get/

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

事件発生

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

chrome

safari

opera

firefox

まとめると

|ブラウザ|$(セレクタ)の戻り値|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を返している．

FireBugとChromeは配列と同等と考え配列の中身を表示している
SafariとOperaはjQueryをオブジェクトと考えObjectとして表示している

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

id:edvakfさん感謝です．

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

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

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

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

僕は３番目だと思うんだけど，GoogleがjQuery をブラウザごとに異なるモノを送ってるとしたらやだなぁ．

時間があれば調べたい．

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