JavaScriptでブラウザ別/バージョン別に処理を変えたい時などに、この「互換モード」が悪さをして、意図した振り分けが出来なかったりするので、その対処法をメモメモ。
一口に「互換モード」といっても、これがふたつの事柄を内包しているのでややこしい。
ひとつはブラウザモード。もうひとつはドキュメントモード。
ブラウザモード：
要は、外部に向けての "自称" が指定されます。
実際には自分は「Internet Explorer 9」であるにも関わらず、外に向けて「私は IE 8 です」とか「IE 7です」とか、身分を詐称する訳ですな。
JavaScript では、navigator.userAgent を参照すれば、そのブラウザが自称している名前とバージョンを知ることができます。
IE 8 / IE 9 で「互換表示」をオンにすると、
Mozilla/4.0 (compatible; MSIE 7.0; .........
…というユーザエージェントが指定されているのが確認できる筈。
実際には自分は「Internet Explorer 9」であるにも関わらず、外に向けて「私は IE 8 です」とか「IE 7です」とか、身分を詐称する訳ですな。
JavaScript では、navigator.userAgent を参照すれば、そのブラウザが自称している名前とバージョンを知ることができます。
IE 8 / IE 9 で「互換表示」をオンにすると、
Mozilla/4.0 (compatible; MSIE 7.0; .........
…というユーザエージェントが指定されているのが確認できる筈。
ドキュメントモード：
Internet Explorerの内部で、どのバージョンのIEの機能を使ってページをレンダリングするかを決定します。
JavaScript では、document.documentMode を参照することで、現在使われているレンダリングモードの種類を知ることができます。
「互換モード」オンの場合、たとえば
7
などという数字が返ってきます。
オフの場合は、
IE 9 ならば「9」、IE 8 ならば「8」
が返ります。
JavaScript では、document.documentMode を参照することで、現在使われているレンダリングモードの種類を知ることができます。
「互換モード」オンの場合、たとえば
7
などという数字が返ってきます。
オフの場合は、
IE 9 ならば「9」、IE 8 ならば「8」
が返ります。
で、ブラウザの自称を、こちら側（ページ作成側）が弄ることはもちろん出来ないのだけれど、どのドキュメントモードで表示して貰いたいかを、こちら側から強制することは出来る。
例えば、
閲覧者が IE の互換表示をオンにしている。でも作成者は、このページを最新のモード(IE 8であれば IE 8 の最新機能を使って、IE 9 であれば IE 9 の以下同文)で表示させたい。
なんて時は、ページの header 部分に<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
という metaタグを書いておけば良いのです。他にも、DOCTYPE宣言 だとか、httpヘッダをカスタマイズすることでも色々出来るみたいですが、ひとまずそれは割愛。
で、JavaScript では、
- スクリプトを走らせるページに上記 metaタグ を設定した上で、
- IE からのアクセスであるかどうかをユーザエージェント( navigtor.userAgent )から判定して、
- もし IE からであれば、ユーザエージェントのバージョン番号ではなく、ドキュメントモード( document.documentMode )の値を参照する。
互換表示 / ブラウザモード / ドキュメントモード に関しては、MicroSoft の解説文書、
→ Internet Explorer 9｜旧バージョンの IE との互換性と検証のポイント（PDF直リンク注意）
が判りやすい。
コメント