zoukankan      html  css  js  c++  java
  • 简单js来判断移动设备还是pc端打开页面

    目前移动端页面出现的地方越来越多,而这个时候页面样式也需要有不同的调整,那么如何判断页面是移动或是pc呢,说到这里,首先来了解一下Navigator 对象。Navigator 对象包含有关浏览器的信息,下面的userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值。所以我们可以通过判断navigator.useragent里面是否有某些值来判断,比如我的电脑是mac,所以打印出来的值为:

    Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36

    这个打印出来的值可以作为了解。

    那如何判断页面是在移动端还是PC端打开的呢?

    网上有很多方法,写的或难或简单,实际上一行代码就够了:

    if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(navigator.userAgent)
    ))) { alert('客户端'); } else { alert('PC端'); }

    以上写法是比较容易理解的,含义就是如果是移动端打开的话那就弹出 "客户端" ,如果不是就弹出"PC端"。

    也可以用正则表达式和三目运算符来写,含义就是如果是移动端打开的话那就跳转到 "https:www.baidu.com/" ,如果不是就跳转到"http://new.baidu.com/":

    window.location.href = /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(navigator.userAgent) ? "https://www.baidu.com/" :  "http://news.baidu.com/";

    就是如此,可以试试看哦!

  • 相关阅读:
    docker入门
    spring aop切面入门
    java 拉姆达 lamdba get
    Spring 3
    Spring 进阶二
    腾讯云 视频 点播 视频上传接口
    js 实时获取后台数据 Spring
    Spring 进阶一
    hibernate 第四天 重点查询的方式
    hibernate 第三天
  • 原文地址:https://www.cnblogs.com/web001/p/8588506.html
Copyright © 2011-2022 走看看