navigatorオブジェクトによるブラウザ識別まとめ

JavaScriptには、navigatorオブジェクトという、ブラウザ等の利用環境を識別するオブジェクトがあります。なんとなく気になったので、”appCodeName”と”appName”と”appVersion”と”userAgent”をそれぞれのブラウザで見たときの動作を、バージョンなどバラバラですが、調べれた分だけまとめてみました。なお、appVersionやuserAgentのかっこ内は、利用しているパソコンの環境によっても異なることがあります。

appCodeNameはいったいなんなんでしょう。ブラウザのコードネームを示すそうなのですが、全部”Mozilla”って・・・。多分中には、”Mozilla”以外を返すものもあるのでしょう。
　ところで、パッと見userAgentを見たら何のブラウザを使ってるか判別できそうですが、どうもこの値は偽装できてしまうそうです。でも、userAgentを使わなかったら、Firefoxを判別できない・・・。

これで終わるのはなんなので簡単に、navigatorオブジェクトを見てリンク先を変える関数作ってみた。

function navlink(bro1link, bro2link, nav){
	if(nav>-1) {
		location.href = bro1link;
	} else {
		location.href = bro2link;
	}
}

使用例

<a href="javascript:navlink('http://am-yu.net/ie9/','http://am-yu.net/ie8/',navigator.appVersion.indexOf('MSIE 9.0'))">クリック！</a>

クリック！

第三引数に、navigatorオブジェクトの検索結果、第一引数に真だった時のリンク先。第二引数に偽だった時のリンク先。ものすごい、使う人にとって親切じゃない関数！ もっと使いやすい関数が書けるようになりたい。後、変数名もうまくつけれるよになりたい・・・

応用例

<a href="javascript:navlink('javascript:navlink(\'http://am-yu.net/ie9/\',\'http://am-yu.net/ie8/\',navigator.appVersion.indexOf(\'MSIE 9.0\'))','javascript:navlink(\'http://am-yu.net/opera/\',\'javascript:navlink(\\\'http://am-yu.net/googlechrome/\\\',\\\'http://am-yu.net/browserpage/\\\',navigator.appVersion.indexOf(\\\'Chrome\\\'))\',navigator.appName.indexOf(\'Opera\'))',navigator.appName.indexOf('Internet Explorer'))">クリック！</a>

クリック！

まどろっこしいにもほどがある！！

余談ですが、WordPressが勝手に'(シングルクォテーション)を”(ダブルクォテーション)に変換するので困りました。上記の”クリック！”というリンクはJavaScriptで制御しています。