以前、こちらで作成したコードはちょうどIE11が出始めたころに作ったが、edgeが出てきたり、簡易的にデバイス判定をしたいときがここ最近で増えた。

過去のコードが色々読みにくいことになっているので、整理の意味合いも込めて作りなおした。

 

agent.js

以下を保存or貼り付け。

var agent =(function(){
	var setVer = 'betternew';
	var userAgent, appVersion; = window.navigator.userAgent.toLowerCase();
	var appVersion = window.navigator.appVersion.toLowerCase();
 
	return{
		reg: function(){
			userAgent = window.navigator.userAgent.toLowerCase();
			appVersion = window.navigator.appVersion.toLowerCase();
			if(userAgent.indexOf('msie') > -1){
				if(appVersion.indexOf('msie 6.0') > -1 || appVersion.indexOf('msie 7.0') > -1 || appVersion.indexOf('msie 8.0') > -1){
					setVer = 'regacy';
				}
			}
		},
		get: function(){
			var ret = '';
			if(userAgent.indexOf('msie') > -1){
				if(appVersion.indexOf('msie 6.0') > -1){
					ret = 'ie6';
				}else if(appVersion.indexOf('msie 7.0') > -1){
					ret = 'ie7';
				}else if(appVersion.indexOf('msie 8.0') > -1){
					ret = 'ie8';
				}else if(appVersion.indexOf('msie 9.0') > -1){
					ret = 'ie9';
				}else if(appVersion.indexOf('msie 10.0') > -1){
					ret = 'ie10';
				}else {
					ret = 'unknown';
				}
			}else if(userAgent.indexOf('edge/') > -1){
				ret = 'edge';
			}else if(userAgent.indexOf('trident/7.0') > -1){
				ret = 'ie11';
			}else if(userAgent.indexOf('firefox') > -1){
				ret = 'firefox';
			}else if(userAgent.indexOf('opera') > -1){
				ret = 'opera';
			}else if(userAgent.indexOf('chrome') > -1){
				ret = 'chrome';
			}else if(userAgent.indexOf('safari') > -1){
				ret = 'safari';
			}else{
				ret = 'unknown';
			}
			return ret;
		},
		dev: function(){
			var ret = '';
			if(userAgent.indexOf('iphone') > -1 || userAgent.indexOf('ipod') > -1 ||(userAgent.indexOf('android') > -1 && userAgent.indexOf('mobile') > -1) ||(userAgent.indexOf('windows') > -1 && userAgent.indexOf('phone') > -1) || userAgent.indexOf('blackberry') > -1){
				ret = 'phone';
			}else if(userAgent.indexOf('ipad') > -1 ||(userAgent.indexOf('windows') > -1 && userAgent.indexOf('touch') > -1) ||(userAgent.indexOf('android') > -1 && userAgent.indexOf('mobile') < 0) || userAgent.indexOf('kindle') > -1 || userAgent.indexOf('playbook') > -1){
				ret = 'tablet';
			}else if(userAgent.indexOf('tablet')){
				ret = 'tablet';
			}else if(userAgent.indexOf('mobile')){
				ret = 'phone';
			}else{
				ret = 'unknown';
			}
			return ret;
		},
		out: function(){
			return setVer;
		}
	};
})();
 
agent.reg();

 

使い方

今回追加したのは以下。

if(agent.dev() === 'phone'){
	//もしもしの時の処理
}else if(agent.dev() === 'tablet'){
	//タブの時の処理
}else{
	//以外
}

 

ブラウザ判定は以前と変わらず。

//IE6ではない場合
if(agent.get() != 'ie6'){
	//何かの処理
}
//IE8以下の場合
if(agent.out() == 'regacy'){
	//何かの処理
}

 

以上、いまさらながらのスクリプト。

 

agent.jsのdevところのデバイス条件を細かに書けば、各端末用にすることも可。

といいつつ、後で条件を細かに書くこと考えて、userAgent.indexOf(‘tablet’)とuserAgent.indexOf(‘mobile’)は別個にした。条件としてはすごくいびつに見える。。

これは主にFirefox用の流れなので、書き方が気に入らない場合、他の条件に振り分ければオッケー。