文章目录

• @Navigator对象
• • $属性
  • $方法
  • 一、获取浏览器用户代理信息`navigator.userAgent`
  • 二、获取运行浏览器的==操作系统或硬件平台==`navigator.platform`
  • 三、 判断浏览器类型
  • 四、判断是手机端、平板还是PC
  • 五、 判断手机机型（移动端解决兼容问题常用）
  • 六、通过屏幕尺寸来进行浏览器类型判断

@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()　　规定浏览器是否支持并启用了 javataintEnabled()　　规定浏览器是否启用数据污点(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浏览器

2. 判断是Android或者iOS

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

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

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") > -1console.log(phone)

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