前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >通过JS检测当前设备类型

通过JS检测当前设备类型

作者头像
子勰
发布2018-05-22 15:39:57
2.3K0
发布2018-05-22 15:39:57
举报
文章被收录于专栏:子勰随笔

背景:

基友做了个APP,发了一排二维码,然后互相吐槽了一下,发现移动应用出现也一年了,虽然很简单,但是好像都懒得通过写个JS来判断然后发一个二维码让大家下载应用。虽然内容不多,而且没啥难度,但是动嘴不如动手,总要有人做,就专门整理一下。

简介:

提供了几个JS接口,通过这几个JS接口,可以轻松获取到当前打开页面的浏览器类型,然后根据类型跳转到对应的链接。同时也提供了两个demo方便大家参考。

对应链接:http://microdemo.bihe0832.com/MultiQrcode/index.html

对应github地址:https://github.com/bihe0832/MultiQrcode

Demo:

Demo1 :

Demo1详细展示了各种设备下的页面跳转(PC和各种移动设备))。不会换起下载,只会打开各种页面。详细的跳转代码参见目录下jump.html

对应链接:http://microdemo.bihe0832.com/MultiQrcode/Demo1/jump.html

Demo2:

Demo2提供了常见应用下载的二维码的方式中,提供一个二维码支持各种平台下载。详细的跳转代码参见目录下download.html

对应链接:http://microdemo.bihe0832.com/MultiQrcode/Demo2/download.html

Tools:

Tools提供了获取是否是移动设备,获取系统,设备类型的各种函数的调用效果。详细的跳转代码参见根目录下tools.html.

对应链接:http://microdemo.bihe0832.com/MultiQrcode/tools.html

实现原理:

利用浏览的navigator中的platform字段和userAgent字段来区分请求来源。

提供接口:

ZixieJS.browser.isPc
  • 功能:判断平台是不是PC
  • 参数:无
  • 返回值:是否为PC设备
ZixieJS.browser.getDevices
  • 功能:判断设备类型
  • 参数:无
  • 返回值:ZixieJS.browser.devices
ZixieJS.browser.getSuperAPP
  • 功能:判断是否为超级app
  • 参数:无
  • 返回值:ZixieJS.browser.app
ZixieJS.browser.getOSDetail
  • 功能:获取具体的PC 操作系统类型和版本号
  • 参数:无
  • 返回值:ZixieJS.browser.OS
ZixieJS.browser.getOS
  • 功能:获取PC系统类型
  • 参数:无
  • 返回值:ZixieJS.browser.OS

代码结构:

代码语言:javascript
复制
 — Demo1: Demo1相关代码
 	- jump.html: Demo1核心代码
 — Demo2: Demo2相关代码
 	- download.html: Demo2核心代码
 — index.html:Demo首页
 — res:页面相关资源
 	- brower.js :核心代码
 — tools.html:JS调用的整体事例。
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2015年08月31日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 背景:
  • 简介:
  • Demo:
    • Demo1 :
      • Demo2:
        • Tools:
        • 实现原理:
        • 提供接口:
          • ZixieJS.browser.isPc
            • ZixieJS.browser.getDevices
              • ZixieJS.browser.getSuperAPP
                • ZixieJS.browser.getOSDetail
                  • ZixieJS.browser.getOS
                  • 代码结构:
                  领券
                  问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档