Navigator对象,获取浏览器类型userAgent,机器类型platform

49 篇文章 2 订阅

@Navigator对象

$属性

  • navigator.appCodeName // 浏览器名称 大多都是Mozilla
  • navigator.appName // 完整的浏览器名称
  • navigator.appVersion // 浏览器版本,一般不与实际的浏览器版本对应
  • navigator.cookieEnabled // 表示cookie是否启用
  • navigator.cpuClass // 客户端计算机使用的CPU类型
  • navigator.javaEnabled() // 表示当前浏览器中是否启用了java
  • navigator.language // 浏览器的主语言
  • navigator.systemLanguage // 操作系统的语言
  • navigator.userLanguage // 操作系统的默认语言
  • navigator.mimeTypes // 在浏览器中注册的MIME类型的数组
  • navigator.onLine // 浏览器是否联网
  • navigator.platform // 浏览器所在的系统平台
  • navigator.plugins // 浏览器中安装的插件信息的数组
  • navigator.product // 产品名称(如Gecko)
  • navigator.productSub // 关于产品的次要信息(如Gecko的版本)
  • navigator.vendor // 浏览器的品牌
  • navigator.vendorSub // 有关供应商的次要信息
  • navigator.registerProtocolHandler() // 针对特定的协议,将一个站点注册为处理程序
  • navigator.oscpu 返回当前操作系统名。
  • navigator.userAgent // 浏览器的用户代理信息

$方法

javaEnabled()  规定浏览器是否支持并启用了 java

taintEnabled()  规定浏览器是否启用数据污点(data tainting)

一、获取浏览器用户代理信息navigator.userAgent

const userAgent = navigator.userAgent;
      console.log(userAgent);
//我这用的谷歌
//Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.114 Safari/537.36

二、获取运行浏览器的操作系统或硬件平台navigator.platform

const platform = navigator.platform;
      console.log(platform);
      //Win32

三、 判断浏览器类型

  1. (Opera、Firefox、Chrome、Safari)
let userAgent= navigator.userAgent;//获取
console.log(userAgent);
if (userAgent.indexOf("Opera") > -1) {	// 判断是否是Opera浏览器
   console.log("Opera");
};
if (userAgent.indexOf("Firefox") > -1) { // 判断是否是Firefox浏览器
   console.log("Firefox");
}
if (userAgent.indexOf("Chrome") > -1) { // 判断是否是Chrome浏览器
   console.log("Chrome");
}
if (userAgent.indexOf("Safari") > -1) {	// 判断是否是Safari浏览器
   console.log("Safari");
}
if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1) {
   console.log("IE");      // 判断是否是IE浏览器
  1. 判断是Android或者iOS
 if (/(Android)/i.test(navigator.userAgent)) {
    return 'Android'

  } else if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
    return 'iOS'
  }

  1. 判断是否是微信浏览器
if (/(MQQBrowser)/i.test(navigator.userAgent)) {
    return true

  } else {
    return false

  }
 if (/(micromessenger)/i.test(navigator.userAgent)) {
    return true

  } else {
    return false

  }

四、判断是手机端、平板还是PC

const type = function (){
    var ua = navigator.userAgent,

    isWindowsPhone = /(?:Windows Phone)/.test(ua),

    isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone,

    isAndroid = /(?:Android)/.test(ua),

    isFireFox = /(?:Firefox)/.test(ua),

    isChrome = /(?:Chrome|CriOS)/.test(ua),

    isTablet = /(?:iPad|PlayBook)/.test(ua) || (isAndroid && !/(?:Mobile)/.test(ua)) || (isFireFox && /(?:Tablet)/.test(ua)),

    isPhone = /(?:iPhone)/.test(ua) && !isTablet,

    isPc = !isPhone && !isAndroid && !isSymbian;

    return {
        isTablet: isTablet,

        isPhone: isPhone,

        isAndroid: isAndroid,

        isPc: isPc

    };

}();

if (type.isAndroid || type.isPhone) {
  console.log("手机")

} else if (os.isTablet) {
  console.log("平板")

} else if(os.isPc) {
  console.log("电脑")

}

五、 判断手机机型(移动端解决兼容问题常用)

    const type = navigator.userAgent
    const phone = type.indexOf("Android") > -1 || 
                    type.indexOf("Adr") > -1
	console.log(phone)

六、通过屏幕尺寸来进行浏览器类型判断

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值