プロプログラマ -Flex,Air,C#,Oracle,PHP-

プログラマーを職業としてます。 Flex,Air,C#,Oracle,PHPの言語ノウハウを中心に情報発信していきます

[jQuery] $()で取得したものはelementそのものではない

jQueryはとても便利なんですが、素のJavaScriptではないため、
同じように使おうとすると、ところどころつまづきます。
つまづいた一例を紹介します。

jQueryの最も便利な機能として、$()によるアクセスがありますが、
これがいまいちわかりにくい。

例えば、

<audio id="testSound">
    <source src="./test.mp3" type="audio/mp3">
</audio>

というエレメントをhtmlに書いた場合、

jQueryからは、$(“#testSound”)でアクセスが可能です。
ただし、このオーディオを再生しようとして、

$("#testSound").play()

などと書くと、エラーとなります。 (TypeError: $(“#testSound”).play is not a function)

実際に$(“#testSound”)で取得された値をFireBugで確認してみると

[audio#testSound]

のような表示になります。
これはエレメントそのものではなく、配列として取得されていることを表しています。

そのため、このaudioエレメントに直接アクセスしたい場合は、

$("#testSound").get(0).play()

とアクセスする必要があるのです。

とても理解しにくい仕様ですが、jQueryのセレクタの仕様として理解するしか有りません。
idへのアクセスなので、配列の中身は常に1つのみになるはずですけどね。

これまでは、

documen.getElementById("testSound")

と同じものなんだと理解していましたが、若干間違ってました。。。

むずかしい。。

 

== ランキングに参加しています。ぜひクリックお願いします ==

プログラム ブログランキングへ
にほんブログ村 IT技術ブログへ
にほんブログ村

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です