Javascriptでブラウザ振り分け。

Question

Javascriptでブラウザの振り分けを行いたいと思います。
振り分けをする対象は
『IE7以前 <--> IE8以降』
サイトを徘徊して色々見て周ったのですが
一番簡単な方法として

if(navigator.appVersion.indexOf("MSIE 5",0) != -1) alert("IE5ですね")

の記述を見つけました。

が、上記のスクリプトはIE5のみを判定するスクリプトで
IE7以下、IE8 の振り分けではなく困っています。

引数として文字列が返ってくるのであれば演算子を 『>』等では難しそうですし・・・。

良い方法はありませんでしょうか？

よろしくお願い致します。

zeff#1 · Accepted Answer

試しに、 NoTitle とやってみたらちゃんとジャンプしましたが、 Firefox,Google Chrome,Operaは一瞬で行ってくれるが、 IE8はもっちゃり元ページの余韻を残しつつ移動する感じです。 IE7は持ち合わせていないので未確認です。でもIE7以下以外はページ遷移しなくていいのでは。透過PNGってIE8とIE以外ではちゃんとしてるんですよね、知らないけど。 IE7以下かどうかだけ確認するなら、こうかなぁ。 NoTitle 根源は、 pngfix.jsが他のスクリプトとバッティングしてるとかそういうのが原因じゃ。ぜんぜんわかんないので詳しい人に任せますが。

yyr446 · Answer

「CSS を「正しく」直せばどのブラウザでも「正しく」解釈する」
という事で、透明PNG画像の問題だけなら、IE独自のfilterを使ってしまえ！
振り分けいらんだろう？

{
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
Src=xxx.png,
SizingMethod=scale);
}

とか、style属性で、

style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='xxx.png',
sizingMethod=scale);">

http://www.htmq.com/style/filter.shtml
http://write-off.cside.com/scripts/55filter/alphaimageloader.htm

だめだ、やっぱりCSS振り分けがいる。

PNG問題に限らず、IE9ベータでも、あいかわらずIE独自のアルファー処理の
問題は尾を引いている。

Chaire · Answer

まず、半透明 PNG は IE5.5 からサポートされていますが、初期設定で無効になっています。質問者さんが仰る pngfix.js がどれか不明ですが、多くの場合、ページ内で拡張子 .png を持つ img 　

これを次のように書き換えます。　書き換えは文書の読み込み時に行われますので、その後に追加された画像には適用できません。しかし、その辺を工夫しているものもあった気がします。いずれにせよ、IE7 からは半透明 PNG が初期設定で有効なので、多くのスクリプトは最初の判定で IE7 以上を除外しています。ですから IE7 で「透過 PNG が使えない」というのは、何らかのミスか見落としであるように思います。 ※フィルタを組み合わせると半透明 PNG がうまく表示されない、などの不具合は報告されていますが。 --- とにかく、IE7 と IE8 を振り分けて何をするのかによりますが、No.1 で例示した条件付きコメントを使えば、両者に別々のスタイルシートを提供できます。もし UA 署名を見てページそのものを変えるのであれば、ブラウザ側の JavaScript ではなくサーバ側のプログラムでやって下さい。飛ばすためのダミーページをいちいちダウンロードさせるのは無駄ですし、そもそもスクリプトが無効になっている可能性もあります。条件付きコメントでを出すのも、苦し紛れの最後の手段としてはアリでしょう。 --- No.2-3 条件付きコンパイルは、プログラムの実行前に条件分岐してコードを生成する、つまり、プログラムの実行時には分岐が跡形もなくなっているからこそ、無駄なく高速に実行できるのです。プログラム実行時に余計な分岐を残すようでは、条件コンパイルを使う意味がありません。 /*@if (@_jscript_version >= 5.8) 　// （だいたい）IE8 以上 @elif (@_jscript_version >= 5.7) 　// （だいたい）IE7 以上 @elif (@_jscript_version >= 5.6) 　// （だいたい）IE6 以上 @elif (@_jscript_version >= 5.5) 　// （だいたい）IE5.5 以上 @elif (@_jscript_version >= 5.0) 　// （だいたい）IE 5.0 以上 @elif (@_jscript_version >= 3.0) 　// （だいたい）IE 4.0 以上 @elif@*/ 　// 条件付きコンパイルを知らない IE 3.0、および他のブラウザ /*@end@*/

zeff#1 · Answer

JScriptのversionによって分岐するとか。 http://msdn.microsoft.com/ja-jp/library/7142yyxw.aspx

Chaire · Answer

振り分けをする目的は何ですか？例えば、よくブラウザごとに CSS を振り分けるスクリプトというのがありますが、スクリプトエンジンの特徴で、レイアウトエンジンを振り分けるのは、あまり賢い方法とは言えません（それに、CSS を「正しく」直せばどのブラウザでも「正しく」解釈するものを、直さずにブラウザのせいにしているケースも少なくない）。また、IE8 には IE8 モード・IE7 モード・IE5 モードの 3 つの文書モードがありますので、UA 署名で IE8 だと判明しても、実は IE5 モードで動いている、という可能性もあります。IE7 にも標準モード・互換モードの 2 つのブラウザモードがあります。ですから、目的が分からないと適切な回答を得るのは難しいでしょう。 --- とりあえず、IE8 で文書モードを知るには document.documentMode を調べて下さい。値は 5、7、8 のいずれかです。IE9 には IE9 モードが導入され、値は 9 です。 IE7 には documentMode がありませんが、document.compatMode でブラウザモードが分かります。"CSS1Compat" なら標準モード（IE7 モード）、"BackCompat" なら互換モード（IE6 の標準モードに相当）です。document.compatMode は IE6 から導入されたものですが、IE6 における "CSS1Compat" は IE6 標準モード、"BackCompat" は IE5 モードです。そういうわけで、IE の開発者は基本的にブラウザ分岐を避けた方が良い、と言ってます（参考リンク）。ブラウザで分岐するのでなく、特徴で分岐しろ、と。まあ、これも状況によるのですが。 --- IE 独自の仕組みに条件付きコメントというのがあります。これも多用すべきではありませんが、目的によってはヒントになるでしょう。 --- JavaScript の質問場ということでなら、IE8 から導入された新機能（querySelector() など）や、IE8 で修正された振る舞い（getAttribute() など）は、IE8 モードでしか動きません。そのためにモードを確認するのは意味のあることです。 ※最近、Microsoft のサイトにある DHTML リファレンスは IE9 の新機能を反映させましたが、それを眺めてると、これは本当に IE なのか？と思いたくなるほど変わりましたね。しかしそれでも、単純にモードを見るだけでは分からないものもありますし、まして UA 署名では穴が大きすぎて基本的に使いものになりません。そういうわけで、繰り返しますが目的がはっきりしないと、適切な判別手段を答えるのは難しいと思われます。参考URL：http://blogs.msdn.com/b/ie/archive/2010/06/16/ie-s-compatibility-features-for-site-developers.aspx

Javascriptでブラウザ振り分け。

試しに、

「CSS を「正しく」直せばどのブラウザでも「正しく」解釈する」

まず、半透明 PNG は IE5.5 からサポートされていますが、初期設定で無効になっています。

JScriptのversionによって分岐するとか。

この回答への補足

振り分けをする目的は何ですか？

この回答への補足

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング