こんにちは、なかわけです。
今日もまた仕事中に困って、解決した問題の話です。
Javascriptで要素（タグ）に属性を設定したり削除したりするときに、
setAttribute()やremoveAttribute()を使用します。
以下はclass属性をセットしたいときの例です。
var element = document.getElementById(“hoge”);
element.setAttribute(“class”, “foo”);
でも、これではIEではうまく動作しません。
IEの場合は、
var element = document.getElementById(“hoge”);
element.setAttribute(“className“, “foo”);
と書かなくてはいけません。
これはバグではなく仕様だそうです。
それから、次は、removeAttribute()で属性を削除する例です。
id属性がhogeのタグについているonClick属性を削除する場合です。
var element = document.getElementById(“hoge”);
element.removeAttribute(“onClick”);
しかし、これだとまたまたIEではうまく動作しません。
ariyasaccaさんのサイトには、IEでは仕様が違うため、
まず、setAttribute()で新しく関数を設定し、それをさらにremoveAttribute()で
削除するという方法を紹介されてました。
でも、なかわけが試してみたところIE7でうまく動きませんでした。
結局、removeAttribute()ではJavascriptを動作させる属性は削除できないみたいでした。
しょうがないので以下のような方法でやり過ごすことにしました。
setAttribute(“onclick”, new Function(“”));
要するに、何もしない関数を設定するという方法。
これだと、クリックしても何も起きないので、
見た目上onClickは削除されたように見えます。
しかも、かなり重要なことを発見しました。
属性名を小文字で書かないとうまく動かない！！（IE7で確認）
setAttribute(“onClick”, new Function(“”));
ではダメなのです。うまく処理されません。
setAttribute(“onclick“, new Function(“”));
今日はこれに気づくまでに1時間かかりました。
これもIEの仕様なんでしょうね。
あ～あ、今日も勉強になった・・・。