スパイスラボ神部です。

opensocial-jquery の勉強のために、いろいろと jQuery の表現を勉強していますが、やっと何となく慣れてきました。OpenSocial アプリのなかで使えるものを中心に、いくつかの jQuery っぽい表現を紹介してみたいと思います。

-オルタナティブが好きだ！ - Favorites!

テキスト出力・イベント取得を助ける jQuery

jQuery をを使ってみて感じたのは、普通 JavaScript を DOM を通じて指示代名詞的に「これ」とか「あれ」として使うところがあるのですが、そういう側面から評価すると「より直感的で使いやすい！」という感じです。

ヒアドキュメントもどき

JavaScript も慣れてしまえば…というところがあるのですが、ちょっと困るのがヒアドキュメント的なものがないところ。その代替として ガジェットWatch: JavaScriptでHTMLを出力するときの小技(ヘッダメニューの続き) なんてエントリもありますが、この方法だと行末に￥マークによるエスケープが必要なのでちょっとかっこわるい＆コピペがしにくい問題があります。

そういうときには、素直に

$("#ID名").html('挿入したいHTML')

みたいにすると、ほぼヒアドキュメント的なことが出来るようです（ニュータイプなjQueryその3-HTML要素アクセス ）。

※もちろん、こちらも改行が入るときは￥マークが必要になるみたいですが…

イベント処理もらくらく

jQuery はすべてのドキュメント要素をデフォルトで監視しているのかどうかわかりませんか、とにかく下記のような簡単な手順で（HTML要素に onClick などを挿入することなく）イベントを取得することが出来ます。これはすごい！

-jQuery:イベント処理 | [E2]e2esound.com

なにがすごいかというと、やっぱりコードが読みやすくなること。単に短くなっているだけ、という見方もあるでしょうが、ここはやっぱりシンプル=正義なのかもしれません。

※OpenSocial で使うときは、要素を挿入するのとイベントの処理を同じコールバック関数内に置かないといけないみたいです。このへんは妙に律儀ですね。

値のセットと参照

フォーム要素の値の参照やセットも次のように簡単です。

-Javascript/jQuery/input要素のvalueを操作する - 俺の基地

ついつい value としてしまいがちですが、ここにあるように val() とするのが大事ですね。引数なしだとその jQuery での指示部分の value フィールドを取得することができます。

とりあえず

まだまだ序の口なことはひしひしと感じているので、慣れて来て応用が利くようになったらまたエントリをあげてみたいと思います。