您的位置：首页 > Web前端 > JavaScript

JS----检测各浏览器及版本2

2014-09-02 14:18 357 查看 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>浏览器检测</title>
<script type="text/javascript" src="style/js/jquery-1.5.2.min.js"></script>
<style type="text/css">
span{font-size:40px; font-family:Verdana;}
.browser{color: green;}
.version{color: orange;}
</style>
</head>

<body>
<span>Your browser is:</span>
<span class="browser"></span>
<span class="version"></span>

<script type="text/javascript">
/*
 * 注意本例代码支持jQuery 1.5.1～jQuery 1.8.3，1.9版本以上$.browser被废弃了
 * 请尝试使用特性检测：http://modernizr.com
 */
 
 var userAgent = navigator.userAgent.toLowerCase(),
   browser = '',
   version = 0;
   
 $.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());
 
 //判断是否是chrome
 if($.browser.chrome){
   userAgent = userAgent.substring(userAgent.indexOf('chrome/') + 7);
   userAgent = userAgent.substring(0, userAgent.indexOf('.'));
   version = userAgent;
   // 因为这里jQuery会把chrome识别为safari，这里我们控制一下
   $.browser.safari = false;
   browser = 'Chrome';
 }
 
 //判断是否为Safari
 if($.browser.safari){
   userAgent = userAgent.substring(userAgent.indexOf('safari/') + 7);
   userAgent = userAgent.substring(0, userAgent.indexOf('.'));
   version = userAgent;
   browser = 'Safari';
 }
 
 //判断是否为非Firefox的Mozilla浏览器
 if($.browser.mozilla){
   //判断是否为firefox
   if(navigator.userAgent.toLowerCase().indexOf('firefox')!=-1){
     userAgent = userAgent.substring(userAgent.indexOf('firefox/') + 8);
     userAgent = userAgent.substring(0, userAgent.indexOf('.'));
     version = userAgent;
     browser = 'Firefox';
   }else{
     browser = 'Mozilla(非Firefox)';
   }
   
 }
 
 //判断是否为Opera
 if($.browser.opera){
   userAgent = userAgent.substring(userAgent.indexOf('version/') + 8);
   userAgent = userAgent.substring(0, userAgent.indexOf('.'));
   version = userAgent;
   browser = 'Opera';
 }
 
 //判断是否是IE
 if($.browser.msie){
   userAgent = $.browser.version;
   userAgent = userAgent.substring(0, userAgent.indexOf('.'));
   version = userAgent;
   browser = 'IE';
 }
 
 
 //最后演示一下如何使用
 $('.browser').append(browser);
 $('.version').append(version);
</script>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航