Javascriptを用いたWeb画面の開発を行う際に、クロスブラウザ対応に
頭を悩ませている開発者の方も多いのではないだろうか?
Javascriptは Internet Explorer や Safari、Firefox などブラウザによって実装されている機能や
振る舞いが異なるため、
という現象が度々発生する。
このようなエラーを回避するため、各ブラウザごとに Javascript の処理を
振り分ける必要があるのだが、そのためには Javascript が実行されている
ブラウザやそのバージョンの判別を行わなければならない。
とはいえ実際のところ、Ajax や入力妥当性検査、画面内の動的な変更等に
Javascript を利用するだけであれば、「IE かそれ以外のブラウザ」を
判別して処理を振り分けるだけで十分なケースが多い、
「IE かそれ以外のブラウザ」を判別するのは実に簡単である。
次の一行だけで簡単に行うことができる。
IE='\v'=='v';
上記の一行をグローバル変数:IE として記述し、次のようにブラウザごとに
処理の振り分けに利用すればよい。
IE='\v'=='v'; function test(){ : if(IE){ // IE用の処理 }else{ // それ以外のブラウザ用の処理 } : }
ボタンをクリックするとブラウザの判別を行い、アラートダイアログが表示されます。
「IEかそれ以外のブラウザ」の判別だけで十分と述べたが、より詳細なブラウザの
判別を行いたい場合もあるだろう。
詳細な判別には、次の記述によってブラウザのユーザエージェント名を参照すればよい。
navigator.userAgent
userAgent にはブラウザのエンジン名が返されるので、内容に含まれる文字列の
MSIE
や Safari
等によってそれぞれの処理を分岐してやればよい。
ボタンをクリックするとブラウザのユーザーエージェントとブラウザ名が表示されます。