JS、Jquery获取浏览器信息

1、背景
在做前端开发时,经常需要解决浏览器兼容性问题,要解决这个问题就先得判断浏览器类型及版本,本人做过几次,因为频率不是很高,所以每次都忘记该怎么做,就需要去百度,而百度的东西很多用不了,或者不怎么好用,找资料又花时间,所以我在这亲测之后,写下这篇文章,希望对自己对大家能有所帮助

2、JS获取浏览器信息

浏览器代码名称:navigator.appCodeName
浏览器名称:navigator.appName
浏览器版本号:navigator.appVersion
对Java的支持:navigator.javaEnabled()
MIME类型(数组):navigator.mimeTypes
系统平台:navigator.platform
插件(数组):navigator.plugins
用户代理:navigator.userAgent

我用IE和谷歌来测
因为判断浏览器的版本一般只能通过分析浏览器的userAgent才能知道,所以我先创建一个JSp,关键代码如下


ie10的结果

JS、Jquery获取浏览器信息_第1张图片
ie10.png

ie9的结果

JS、Jquery获取浏览器信息_第2张图片
ie9.png

ie8的结果

JS、Jquery获取浏览器信息_第3张图片
ie8.png

谷歌浏览器的结果

JS、Jquery获取浏览器信息_第4张图片
Google Chrome.png

由图可以看出,不同的浏览器有不同的标识,我们区分浏览器,只需要匹配对应的标识即可,下面列出常见浏览器判断

var explorer =navigator.userAgent ;
//ie 
if (explorer.indexOf("MSIE") >= 0) {
alert("ie");
}
//firefox 
else if (explorer.indexOf("Firefox") >= 0) {
alert("Firefox");
}
//Chrome
else if(explorer.indexOf("Chrome") >= 0){
alert("Chrome");
}
//Opera
else if(explorer.indexOf("Opera") >= 0){
alert("Opera");
}
//Safari
else if(explorer.indexOf("Safari") >= 0){
alert("Safari");
} 
//Netscape
else if(explorer.indexOf("Netscape")>= 0) { 
alert('Netscape'); 
} 

3、Jquery判断浏览器类型和浏览器版本号的方法

$(document).ready(function(){
 
  var brow=$.browser;
 
  var bInfo="";
 
  if(brow.msie){bInfo="MicrosoftInternetExplorer"+brow.version;}
 
  if(brow.mozilla){bInfo="MozillaFirefox"+brow.version;}
 
  if(brow.safari){bInfo="AppleSafari"+brow.version;}
 
  if(brow.opera){bInfo="Opera"+brow.version;}
 
  alert(bInfo);
  alert(nui.encode(brow));//这是普元的nui函数,是把json格式的数据转换成字符串
 
});

用ie9测试,其它的就不赘述了

JS、Jquery获取浏览器信息_第5张图片
2017-06-30_113854.png
JS、Jquery获取浏览器信息_第6张图片
2017-06-30_113907.png

如有问题或有想相互学习交流的,可以联系本人(邮箱:[email protected],微信:caililiangcaililiang,QQ:785553790)

你可能感兴趣的:(JS、Jquery获取浏览器信息)