- 2009-02-19 (木)
- 技術
HTMLタグにカスタムな属性を追加しJSから取得する方法
なんかいまさらな気もしますが備忘録として。
たとえばdojoなんかを使っていると以下のようにエレメントの属性に見たこともないのが書いてあったりする。
dojoのカスタム属性の場合
scriptタグのdjConfig、divタグのdojoTypeがそうですね。
自前のカスタム属性の場合
これを単純に自前でやってみる。
divタグにhogeという属性を書いて見ていざelem.hogeで値を表示しようと試みるがFirefoxでundefinedが返ってきてしまう。
でもIEではうまく取れた・・・
なんでだろう・・・
とりあえずFirebugで追ってみた。
まずはelemオブジェクトを見てみる。
一生懸命hogeプロパティを探してみるが見つからない。だがidプロパティは存在している。
次に属性としてちゃんと登録されているか確かめてみる。
として、attributesの中身を拝見。
- item(0)
- Attr nodeName=hoge nodeValue=hoge nodeType=2
- item(1)
- Attr nodeName=id nodeValue=hoge nodeType=2 childNodes=[1]
- length
- 2
一部割愛したが属性の個数が2個になってる！
そして0番目にはnodeName=hogeと、hoge属性が格納されていた。
まとめ
普段あんまり気にしていなかったが、自分で追加した属性値はelem.hogeと書いても取得することができない。（Firefoxだと）
なので以下のようにして取得すること！
ちなみにjQueryを使っているなら以下のように書くからあんまり気にしないでも問題ないですね。
Trackback:0
- TrackBack URL for this entry
- http://hisasann.com/cgi-bin/mt/mt-tb.cgi/1157
- Listed below are links to weblogs that reference
- HTMLタグにカスタムな属性を追加しJSから取得する方法 from HouseTect, JavaScriptな情報をあなたに
