Navigator对象

  首先来了解一下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

具体含义不解释,有兴趣同学自行百度,可以看到里面含有 Mac 字样,其他的也是类似的。

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

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

window.location.href = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) ? "https://www.baidu.com/" :  "http://news.baidu.com/";

  

以上代码利用了正则表达式三目运算符,含义就是如果是移动端打开的话那就跳转到 "https:www.baidu.com/" ,如果不是就跳转到"http://new.baidu.com/",这个看不懂的话,那我下面这样写就很容易理解了吧

if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
window.location.href = "https://www.baidu.com/";
} else {
window.location.href = "http://news.baidu.com/";
}

  什么?if里面的判断还是看不懂?实际上就是利用正则去判断 navigator.useragent 是否含有 Android/webOs/iphone 等字符串,并且利用修饰符 "i" 做了不区分大小写,然后用正则的方法 test 去判断是否满足,如果这种方式不理解的话完全可以利用字符串的 indexOf 方法去判断。

js区别手机和电脑打开网页的更多相关文章

  1. 【google chrome 一键打开 谷歌跳转的页面+JS Replace】谷歌无法打开网页的时候,提取网页中url的部分

    经常在谷歌搜索,遇到网页无法打开,然后就停留在比如:http://www.google.com.hk/search?newwindow=1&safe=strict&site=& ...

  2. JS判断手机还是电脑访问网站

    function check() { let browser = navigator.userAgent;//用户访问的类型 let phone = ["Android", &qu ...

  3. PHP和JS判断手机还是电脑访问

    当用户使用手机等移动终端访问网站时,我们可以通过程序检测用户终端类型,如果是手机用户,则引导用户访问适配手机屏幕的移动站点.本文将介绍分别使用PHP和JAVASCRIPT代码判断用户终端类型. PHP ...

  4. 手机访问电脑本地localhost网页

    项目需要用手机访问电脑本地网页,从而可以调试项目,对代码的理解的快一点 重点 确保手机和电脑在同一个局域网 可以通过手机开热点电脑连接或者电脑开便携式热点手机连接 确保电脑的防火墙是关闭的 打开apa ...

  5. PHP和javascript判断用户使用的是手机还是电脑

    PHP判断手机还是电脑 <?php $is_mobile = (is_mobile() == true) ? "手机" : "电脑"; echo '< ...

  6. 在WPF程序中打开网页:使用代理服务器并可进行JS交互

    本项目环境:使用VS2010(C#)编写的WPF程序,通过CefSharp在程序的窗体中打开网页.需要能够实现网页后台JS代码中调用的方法,从网页接收数据,并能返回数据给网页.运行程序的电脑不允许上网 ...

  7. js/bat批处理调用谷歌浏览器chrome批量打开网页测试web性能

    批处理批量打开网页 其实用java就可以搞定,但是这么一个轻巧的测试,js或者bat批处理去一次性打开几百个网页测试一下页面没必要上java 两者的区别,js的话,只能打开多个浏览器实例,不方便查看效 ...

  8. js判断是手机还是电脑访问网站

    js判断是手机还是电脑访问网站                               <script type="text/javascript"> <!- ...

  9. js实现打开网页自动弹出添加QQ好友邀请窗口

    我们有时进一些网面或专题页面会自动弹出一个加为好友的对话框了,在研究了很久之后发现可以直接使用js来实现,下面我们一起来看js实现打开网页自动弹出添加QQ好友邀请窗口的方法. 第一步.JS脚本 这个是 ...

随机推荐

  1. hdu6397 Character Encoding 母函数解约束条件下多重集

    http://acm.hdu.edu.cn/showproblem.php?pid=6397 原问题的本质是问m个元素的多重集S,每一种类型的对象至多出现n-1次的S的k组合的个数是多少? 等价于 x ...

  2. A Method for the Construction of Minimum-Redundancy Codes

    A Method for the Construction of Minimum-Redundancy Codes http://compression.ru/download/articles/hu ...

  3. [archlinux][crypto] 从T450迁移archlinux操作系统至T460s笔记本

    从T450笔记本迁移archlinux操作系统之T460s笔记本,同时: 1.  使用cryptsetup做底层块加密. 2.    全新使用btrfs文件系统. 一,硬盘分区. 1T的SSD,使用U ...

  4. java JDBC (八) 连接池 DBCP

    package cn.sasa.demo1; import javax.sql.DataSource; import org.apache.commons.dbcp2.BasicDataSource; ...

  5. SQL Server 无法连接数据库

    1.打开SQL server 配置管理器-->SQL server 网络配置-->实例名的协议 2.保证SQLEXPRESS协议中的Named Pipes和 TCP/IP启用. 3.点击S ...

  6. 深入了解HBASE架构(转)

    dd by zhj: 最近的工作需要跟HBase打交道,所以花时间把<HBase权威指南>粗略看了一遍,感觉不过瘾,又从网上找了几篇经典文章. 下面这篇就是很经典的文章,对HBase的架构 ...

  7. Eclipse EE下载安装与配置

    Eclipse EE下载安装与配置 一.下载 下载链接:http://www.eclipse.org/downloads/eclipse-packages/ 1.进入Eclipse官网进行下载选择Ec ...

  8. 类的copy和deepcopy

    - (instancetype)initWithName:(NSString *)name age:(NSUInteger)age sex:(CYLSex)sex { if(self = [super ...

  9. 如何将文章列表用<li>分两列显示

    我们平时用ul或ol标签来罗列文章列表时默认是一列,为了美观起见,想把它们两列显示要如何操作呢?怎么用css定义它们? 其实相对比较简单,用几行css样式定义一下就够了,可以用div + css来控制 ...

  10. 20170803 Airflow自带的API进行GET 和POST动作部分内容

    --1 首先你要有安装好的Airflow 环境并且在配置文件中有启用API 属性 --2 就是GET 和POST 方法的调用了 这里说一下,由于Airflow在网络上的资料比较少,可以从GETHUB中 ...