高级前端
dom
【Q210】如何判断当前环境是移动端还是PC端

如何判断当前环境是移动端还是PC端

Issue 欢迎在 Gtihub Issue 中回答此问题: Issue 211 (opens in a new tab)

Author 回答者: shfshanyue (opens in a new tab)

判断 navigator.userAgent,对于 Android/iPhone 可以匹配以下正则

const appleIphone = /iPhone/i;
const appleIpod = /iPod/i;
const appleTablet = /iPad/i;
const androidPhone = /\bAndroid(?:.+)Mobile\b/i; // Match 'Android' AND 'Mobile'
const androidTablet = /Android/i;

当然,不要重复造轮子,推荐一个库: https://github.com/kaimallea/isMobile (opens in a new tab)

import isMobile from "ismobilejs";
 
const mobile = isMobile();

Author 回答者: SageSanyue (opens in a new tab)

isPc() {
    var userAgentInfo = navigator.userAgent
    var Agents = new Array(
      'Android',
      'iPhone',
      'SymbianOS',
      'Windows Phone',
      'iPad',
      'iPod'
    )
    var flag = true
    for (var v = 0; v < Agents.length; v++) {
      if (userAgentInfo.indexOf(Agents[v]) > 0) {
        flag = false
        break
      }
    }
    return flag
  }

嘿嘿照搬了一段商用的

Author 回答者: shfshanyue (opens in a new tab)

@SageSanyue 直接用 Array.prototype.some 就简单多了

Author 回答者: SageSanyue (opens in a new tab)

@SageSanyue 直接用 Array.prototype.some 就简单多了

确实噢😯我完全没动我的zhu脑子:(

isPc() {
    var userAgentInfo = navigator.userAgent
    var Agents = new Array(
      'Android',
      'iPhone',
      'SymbianOS',
      'Windows Phone',
      'iPad',
      'iPod'
    )
    var flag = true
    flag = !Agents.some((ele) => {
        return userAgentInfo.indexOf(ele) > 0
    })
    return flag
  }

Author 回答者: BonjourYY (opens in a new tab)

@SageSanyue 直接用 Array.prototype.some 就简单多了

确实噢😯我完全没动我的zhu脑子:(

isPc() {
    var userAgentInfo = navigator.userAgent
    var Agents = new Array(
      'Android',
      'iPhone',
      'SymbianOS',
      'Windows Phone',
      'iPad',
      'iPod'
    )
    var flag = true
    flag = !Agents.some((ele) => {
        return userAgentInfo.indexOf(ele) > 0
    })
    return flag
  }

是不是应该考虑 >= 0 或者 !==-1 会更好一点呢?