JS判断浏览器

  判断是不是移动设备浏览现如今各种终端越来越多,用户可以随时随地在任何设备上查看优质的网页,但是这对于前端程序员来说也是时代的考验。
  早年间就一台电脑,而且显示器就那么点大,怎么都好做,现在···说多了全是泪。
  之前一直把在多个项目里面运用相同功能的JS函数代码,这让每次我们都在文件中不停地复制,后来就想着把经常能用到的函数做成代码库。以后的项目只需要引用.js文件就可以了。
  想了老半天,名字想不好,也想搞个高端、大气、上档次的,但是苦于“哥是个文盲”,索性把代码贴出来,反正都不是我写的,我就是喜欢用。

  1. 判断浏览器类型
//获取浏览器类型 
function getExploerName(){ 
var explorer =navigator.userAgent; var className = '';
//ie  
if (explorer.indexOf("MSIE") >= 0) { 
   className = 'ie'; 
} 
//firefox  
else if (explorer.indexOf("Firefox") >= 0) { 
   className = 'Firefox'; 
} 
//Chrome 
else if(explorer.indexOf("Chrome") >= 0){ 
   className = 'Chrome'; 
} 
//Opera
else if(explorer.indexOf("Opera") >= 0){ 
   className = 'Opera';
}
//Safari 
else if(explorer.indexOf("Safari") >= 0){ 
   className = 'Safari'; 
} 
//Netscape 
else if(explorer.indexOf("Netscape")>= 0) { 
   className = 'Netscape';
} 
   return className;
} 
  1. 判断是不是移动设备浏览
function isMobile() { 
    if((navigator.userAgent.indexOf('iPod') != -1) || (navigator.userAgent.indexOf('iPad') != -1) || (navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('Android') != -1)){ 
        return true; 
    }else{ 
        return false; 
    } 
}
  1. 判断是不是微信浏览器
function isWeixn(){ 
      var ua = window.navigator.userAgent.toLowerCase(); 
      if(ua.match(/MicroMessenger/i)=="micromessenger") { 
        return true; 
      } else { 
        return false; 
      }
 }
  1. 判断移动设备横屏or竖屏
//判断iphone、ipad横屏还是竖屏 
function orient() { 
    if (window.orientation == 90 || window.orientation == -90) { 
        //ipad、iphone竖屏/Andriod横屏
        $("body").attr("class", "landscape"); orientation = 'landscape'; 
        console.log("横屏"); 
        return false; 
    } else if (window.orientation == 0 || window.orientation == 180) {
        //ipad、iphone横屏;Andriod竖屏 
        $("body").attr("class", "portrait"); orientation = 'portrait'; console.log("竖屏"); 
        return false; 
    } 
} 
//页面加载时调用 
$(function () { orient(); }); 
//用户变化屏幕方向时调用 
$(window).bind('orientationchange', function (e) { orient(); });
  1. 判断移动终端类型
//判断移动终端类型
var browser = { 
     versions:function(){ 
     var u = navigator.userAgent, app = navigator.appVersion; 
     return ; 
     }(), 
     language:(navigator.browserLanguage || navigator.language).toLowerCase()
}
document.writeln("语言版本: "+browser.language);
document.writeln(" 是否为移动终端: "+browser.versions.mobile);
document.writeln(" ios终端: "+browser.versions.ios);
document.writeln(" android终端: "+browser.versions.android);
document.writeln(" 是否为iPhone: "+browser.versions.iPhone);
document.writeln(" 是否iPad: "+browser.versions.iPad);
document.writeln(navigator.userAgent);

类似的方法很多
分享一个使用实例:

if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
     //alert(navigator.userAgent);  
     window.location.href ="iPhone.html";
} else if (/(Android)/i.test(navigator.userAgent)) {
     //alert(navigator.userAgent);  
     window.location.href ="Android.html";
} else { 
     window.location.href ="pc.html";
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容