vue判断ie浏览器,前端开发如何判断浏览器类型
这篇文章主要介绍了某视频剪辑软件开发之不同浏览器的类型判断方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
目录
一、通过navigator.userAgent来进行浏览器类型判断定义和用法语法navigator.userAgent使用场景判断是机器人或者ios判断是否是微信浏览器判断是否是即时通信软件浏览器判断是手机端、平板还是PCnavigator.userAgent格式二、通过导航器。平台来进行浏览器类型判断定义和用法语法导航器。平台使用场景判断是机器人或者iOSnavigator。平台返回的可能值三、通过屏幕尺寸来进行浏览器类型判断
一、通过navigator.userAgent来进行浏览器类型判断
定义和用法
用户代理属性是一个只读的字符串，声明了浏览器用于超文本传送协议请求的用户代理头的值。
一般来讲，它是在navigator.appCodeName的值之后加上斜线和navigator.appVersion的值构成的。
例如：Mozilla/4.0(兼容；MSIE 6.0Windows NT 5.2SV1 .净CLR 1.1.4322)。
注：用户代理头：用户代理标题。
语法
navigator.userAgent
navigator.userAgent使用场景
判断是Android或者iOS
/**
* 判断浏览器类型：Android/iOS
*/
函数getOSType() {
if(/(Android)/I . test(navigator。用户代理){
返回"安卓"
} else if(/(iPhone iPad iPod iOS)/I . test(navigator。用户代理){
返回" iOS "
}
}
判断是否是微信浏览器
函数是_weixin(){
if(/(微信使)/I . test(领航员。用户代理){
返回真实的
}否则{
返回错误的
}
}
判断是否是QQ浏览器
功能是_qq(){
if(/(MQ浏览器)/I . test(导航器。用户代理){
返回真实的
}否则{
返回错误的
}
}
判断是手机端、平板还是PC
var os=function (){
var ua=navigator.userAgent，
iswindowphone=/(？Windows Phone)/.测试(ua)，
isSymbian=/(？SymbianOS)/.test(ua) iswindowphone，
isAndroid=/(？安卓)/。测试(ua)，
isFireFox=/(？火狐)/。测试(ua)，
isChrome=/(？ChromeCriOS)/.测试(ua)，
isTablet=/(？iPadPlayBook)/.测试(ua) (isAndroid！/(?手机)/。test(ua)) (isFireFox /(？平板)/。测试(ua))，
isPhone=/(？iPhone)/.测试(ua)！isTablet，
isPc=！isPhone！isAndroid！伊斯姆比安
返回{
isTablet: isTablet，
我打电话：我打电话，
isAndroid: isAndroid，
isPc: isPc
};
}();
if (os.isAndroid os.isPhone) {
console.log(手机)
} else if (os.isTablet) {
console.log(平板)
} else if(os.isPc) {
console.log(电脑)
}
navigator.userAgent格式
部分浏览器格式如下（PC）：
铬浏览器：Mozilla/5.0(Windows NT 10.0；win 64x 64)apple WebKit/537.36(KHTML，像壁虎一样)Chrome/62。0 .3202 .94 Safari/537.36 ie 11浏览器：Mozilla/5.0(Windows NT 10.0；WOW64三叉戟/7.0;网络4.0C .网络4.0E .净CLR 2。0 .50727;净CLR 3。0 .30729;净CLR 3。5 .30729;迈克菲；rv:11.0像壁虎法里5.1MAC:用户代理：Mozilla/5.0(麦金塔；u；英特尔MAC OS X 10 _ 6 _ 8；en-us) AppleWebKit/534.50 (KHTML，像壁虎一样)版本/5.1 Safari/534.50 Safari 5.1Windows:用户代理：Mozilla/5.0(Windows；u；windows NT 6.1 en-us)apple WebKit/534.50(KHTML，像壁虎一样)版本/5.1 Safari/534.50火狐4。0 .1MAC:用户代理：Mozilla/5.0(麦金塔；英特尔MAC OS X 10.6；RV:2。0 .1)壁虎/2010 01 01火狐/4。0 .1火狐4。0 .1Windows:用户代理：Mozilla/5.0(Windows NT 6.1；RV:2。0 .1)壁虎/2010 01 01火狐/4。0 .1 Opera 11.11MAC:用户代理：Opera/9.80(麦金塔；英特尔麦克OS X 10。6 .8;u；en)急板/2.8.131版本/11.11 Opera 11.11Windows:用户代理：Opera/9.80(Windows NT 6.1；u；en)急板/2.8.131版本/11.11360浏览器：用户代理：Mozilla/4.0(兼容；MSIE 7.0Windows NT 5.1360SE)搜狗浏览器1.x:用户代理：Mozilla/4.0(兼容；MSIE 7.0Windows NT 5.1三叉戟/4.0;东南2 .X MetaSr 1.0SE 2 .X MetaSr 1.0 .净CLR 2。0 .50727;东南2 .X MetaSr 1.0)部分浏览器格式如下（移动端）：
iPhone 6:Mozilla/5.0(iPhone；CPU iPhone OS 9_1像Mac OS X)苹果WebKit/601。1 .46(KHTML像壁虎)版本/9.0移动/13b 143 Safari/601.1 iPad:Mozilla/5.0(iPad；CPU操作系统9_1像Mac OS X)苹果WebKit/601。1 .46(KHTML像壁虎)版本/9.0手机/13b 143 Safari/601.1安卓QQ浏览器对于安卓系统：用户代理：MQQBrowser/26 Mozilla/5.0(Linux；u；安卓2 .3 .7;zh-cn；MB 200 Build/grj 22；CyanogenMod-7)苹果WebKit/533.1(KHTML，像壁虎一样)版本/4.0移动Safari/533.1 windows Phone:用户代理：Mozilla/5.0(兼容；MSIE 9.0Windows Phone OS 7.5三叉戟/5.0;IEMobile/9.0；常简称为HTC或宏达电泰坦)黑莓：用户代理：Mozilla/5.0(黑莓；u；黑莓9800;en) AppleWebKit/534.1 (KHTML，像壁虎)版本/6.0.0.337移动Safari/534.1 UC标准：用户代理：诺基亚5700/UCWEB7.0.2.37/28/999
二、通过navigator.platform来进行浏览器类型判断
因为各大浏览器厂商可以对navigator.userAgent进行设置，导致了用户代理格式的混乱。例如：华为mate10默认浏览器用户代理的信息如下：
Mozilla/5.0(Windows；u；windows NT 5.2 en-US)apple WebKit/537.36(KHTML，像壁虎)铬/40。0 .2214 .89野生动物园/537.36
结果可想而知，根据用户代理做出的判断：当前浏览器类型为个人电脑。所以需要在通过navigator.userAgent判断的基础上再对导航器。平台进行判断，以此来确保浏览器类型判断的准确性。
定义和用法
平台属性是一个只读的字符串，声明了运行浏览器的操作系统和（或)硬件平台。
语法
导航器。平台
navigator.platform使用场景
判断是Android或者iOS
/**
* 判断是机器人或者ios
*/
函数getPlatformType() {
if(安卓===导航仪。平台){
返回"安卓"
} else if( iPhone ===navigator。平台 iPod ===导航器。平台 iPad ===导航仪。平台){
返回" iOS "
}
}
navigator.platform返回的可能值
惠普UX公司
Linux i686
Linux armv7l
Mac68K
MacPPC
麦金特尔
苏诺斯
Win16
Win32
畏缩
苹果手机
iPod播放器播放器
苹果平板电脑
机器人
黑莓
歌剧
三、通过屏幕尺寸来进行浏览器类型判断
通过屏幕大小可以判断浏览器类型
获取屏幕宽度的方法如下：
网页可见区域宽：document.body.clientWidth网页可见区域高：document.body.clientHeight网页可见区域宽：document.body.offsetWidth(包括边线的宽)网页可见区域高：document.body.offsetHeight(包括边线的宽)以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。