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;
    }  

2. 判断是不是移动设备浏览

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;    
        }
    }

3. 判断是不是微信浏览器

function isWeixn(){
        var ua = window.navigator.userAgent.toLowerCase();
        if(ua.match(/MicroMessenger/i)=="micromessenger") {
            return true;
        } else {
            return false;
        }
    }

4. 判断移动设备横屏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();
    });

5. 判断移动终端类型

//判断移动终端类型
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";
};

 

posted @ 2015-04-01 14:22  通宵狗  阅读(211)  评论(0)    收藏  举报