2009年8月18日火曜日

InternetExplorerのDOM属性認識

ここのところJavaScriptのライブラリjQueryのプラグインをいくつも作っていて気がついたのだが、InternetExplorer(IE)のJavaScript(JScript?)におけるDOM要素や、そのinnerHTMLプロパティからアクセスできるHTMLソースコードには独特なものがある。

Firefox、SafariではinnerHTMLプロパティからアクセスできるソースコードはタグ名がすべて小文字アルファベットで、XHTML的。ただしBR要素やHR要素、IMG要素などの元来閉じタグのない要素について末尾を「~/>」で終わらせる、というようなことはされていない。

Operaではある意味、innerHTMLというプロパティ名からして正しい挙動なのかもしれないが、タグ名はすべて大文字になる。

IEでは、innerHTMLプロパティから得られるソースコードは、Opera同様タグ名が大文字になる。そして属性値は、値にスペースが入らない種類のものである限り、「"~"」(クオテーション)で囲われていない。さらに、STYLE属性の、CSSプロパティ名がなぜかみな大文字アルファベットになっている。

これはDOM要素の属性にアクセスするためのプロパティを通じて、STYLE属性にアクセスした場合も同様であるらしい。CSSプロパティ名は大文字であった。

以上でもすでにして、IEのDOMが恐ろしくなってくるのだが、さらに問題があった。
IEでは手書きのソースコードや、DOMのメソッドを用いて作成したDOM要素に、手動で指定してはいない数多くの──おびただしい数の属性が追加される。innerHTMLプロパティを用いるにせよ、attributesプロパティを用いるにせよ、これらのプロパティによって得られるソースコードや属性の情報にはこちらが予期していない、しかもものすごい数の属性が含まれている。

たとえばTD要素(テーブルのセル)のcolspan、rowspanなどはこちらが指定しなくても、DOMのプロパティとしては存在していて、初期値は1。disabledという属性を持つことのできる要素については、かならず「disabled=false」。その他のすべての要素には「tabindex=1」が勝手にセットされているし、「on~」という形式のイベントリスナを指定する属性も空文字列が値として指定されて存在している。

これは結構タチが悪く、ソースコードがやたらと長く、また読みにくくなるし、下手に標準値などを指定されると困る場面がある(IEのDOMから得られたソースコードを他のブラウザで利用するときなど)。

結局上記4ブラウザでHTMLソースコードを標準化する(そして何らかの別の処理に用いる)には、

  1. IEとOperaでは、タグ名の小文字化を実施し、
  2. IEでは、「"~"」で囲われていない属性値を囲い、
  3. IEでは、STYLE属性についてはCSSプロパティ名部分を小文字化し、
  4. IEでは、さらに値が「0」であったり、「false」や「null」、「""」(空文字列)であるような属性は、(属性値だけでなく)属性ごとカットしてしまい、これは場合にもよるが「tabindex」については「1」であればこれも属性ごと削除する

──という処理が必要になる。

0 件のコメント: