勝手属性でシンプルに書いてみる

JavascriptとHTMLの絡ませ方２・・・・、出来るかな〜と思ってたらできた。使うと意外に便利かもということで勝手属性です。

webアプリを作るときは大体、裏側でHTMLを動的に生成して、クライアント側でその値をJavascriptでグリグリイジルというのが普通ですね。ここで動的HTML生成を工夫すると結構Javascriptの記述が楽になったりします。

何かオブジェクトに対する付加情報を持ちまわるためにやたら

<input type="hidden" value="なになに">

を埋め込みまくってました。ほんと今思うと・・・ダメダメですね。

ここで利用するのが勝手属性。これも実験するまで知らなかったんですけど、属性って勝手になんでもくっつけていいんですねｗ。　つまり

<p id="pepepe" hoge="裏裏情報">表情報</p>

こんなことをやっていいと。こう動的に生成してやればオブジェクトと値が一体化して管理できるので、Javascriptで特に意識して欠かなくてもいいから楽ですよね

っで

alert(document.getElementById("pepepe").hoge);

あれ・・・エラーっすｗ。当然といえば当然で、Javascriptでhogeなんていうプロパティが定義されてないんですね。実はこういうのって普通にあってFlashが使うタグの属性なんかもJavascriptで直接制御できるプロパティが無い、ここにも抜け道があって

alert(document.getElementById("pepepe").getAttribute("hoge"));

こいつでOK。要素と一体化している付加情報はサーバ側で生成する段階で勝手属性としてぶら下げると、使い勝手がよくなるな〜　っと思ってエントリー。

この技って結構みなさんつかってるんですかね

初めてのJavaScript