js判断浏览器检测浏览器类型和设备类型

有时候我们需要判断浏览器的内核、是否是移动端、ios终端、android终端、是否iPad等，下面是整理出来的一个比较完整的js方法。

<script>
var browser = {
            versions: function () {
                var u = navigator.userAgent;
                return {
                    trident: u.indexOf('Trident') > -1, //IE内核
                    presto: u.indexOf('Presto') > -1, //opera内核
                    webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
                    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,//火狐内核
                    mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
                    ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
                    android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
                    iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
                    iPad: u.indexOf('iPad') > -1, //是否iPad
                    webApp: u.indexOf('Safari') == -1, //是否web应该程序，没有头部与底部
                    weixin: u.indexOf('MicroMessenger') > -1, //是否微信 （2015-01-22新增）
                    qq: u.match(/\sQQ/i) == " qq" //是否QQ
                };
            }(),
            language: (navigator.browserLanguage || navigator.language).toLowerCase()
        }
        
        console.log(browser.versions)
</script>

通过navigator.userAgent属性获取用户代理字符串，然后根据特定的关键词或正则表达式判断用户所使用的浏览器和设备类型。

具体解释如下：

1. browser.versions是一个对象，包含了各种浏览器和设备类型的判断结果。

2. trident: u.indexOf('Trident') > -1判断是否为IE内核的浏览器，通过检查用户代理字符串中是否包含"Trident"关键词来判断。

3. presto: u.indexOf('Presto') > -1判断是否为Opera内核的浏览器，通过检查用户代理字符串中是否包含"Presto"关键词来判断。

4. webKit: u.indexOf('AppleWebKit') > -1判断是否为苹果、谷歌内核的浏览器，通过检查用户代理字符串中是否包含"AppleWebKit"关键词来判断。

5. gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1判断是否为火狐内核的浏览器，通过检查用户代理字符串中是否包含"Gecko"关键词且不包含"KHTML"关键词来判断。

6. mobile: !!u.match(/AppleWebKit.*Mobile.*/)判断是否为移动终端，通过检查用户代理字符串中是否包含"AppleWebKit"和"Mobile"关键词来判断。

7. ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)判断是否为iOS终端，通过检查用户代理字符串中是否包含"(i; CPU"和"Mac OS X"关键词来判断。

8. android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1判断是否为Android终端，通过检查用户代理字符串中是否包含"Android"或者"Adr"关键词来判断。

9. iPhone: u.indexOf('iPhone') > -1判断是否为iPhone或者QQHD浏览器，通过检查用户代理字符串中是否包含"iPhone"关键词来判断。

10. iPad: u.indexOf('iPad') > -1判断是否为iPad，通过检查用户代理字符串中是否包含"iPad"关键词来判断。

11. webApp: u.indexOf('Safari') == -1判断是否为web应用程序，通过检查用户代理字符串中是否不包含"Safari"关键词来判断。

12. weixin: u.indexOf('MicroMessenger') > -1判断是否为微信浏览器，通过检查用户代理字符串中是否包含"MicroMessenger"关键词来判断。

13. qq: u.match(/\sQQ/i) == " qq"判断是否为QQ浏览器，通过检查用户代理字符串中是否包含"QQ"关键词来判断。

14. language: (navigator.browserLanguage || navigator.language).toLowerCase()获取浏览器语言，通过navigator.browserLanguage或navigator.language属性获取，然后转换为小写字母。