CSS3出来后,我们一般都是通过@media媒体查询来实现网页自适应,但是有时候,还是需要我们根据不同的设备来对应的做不同的显示,这时候,我们需要知道当前用户访问我们的界面用的是什么设备,怎么获取呢?

var os = 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 (os.isAndroid || os.isPhone) {

  alert("phone" );

} else if (os.isTablet) {

  alert("pad" );

} else if (os.isPc) {

   alert("pc")
}

JS判断当前设备类型的更多相关文章

  1. JS判断设备的类型

    利用JS判断浏览器的用户代理,从而获得设备类型.利用这个方法可以获得用户的设备是移动设备还是PC设备.     JS代码如下:       function browerType() {       ...

  2. js判断设备(转)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. js判断本机是否已安装app

    需求:在浏览器或者app webview中打开的页面,js判断本机是否已安装搜狐新闻客户端. 一.微信 1.分享——好友/朋友圈,feed会有搜狐新闻标记,打开url后缀参数isappinstalle ...

  4. js判断网页是否加载完毕 包括图片

    <script type="text/javascript" language="JavaScript"> //: 判断网页是否加载完成 docum ...

  5. 为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件

    为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件.样式文件命名格式如:forms[_屏幕宽度].css,样式文件中只需重新定义文本框和下拉框的宽度即可. 在包含的头文件 ...

  6. JS判断网页是否在微信中打开/

    JS判断网页是否在微信中打开,代码如下: <script type="text/javascript"> function is_weixn(){ var ua = n ...

  7. js判断当前页面在移动设备还是在PC端中打开

    方法一: var isPC = function () { var userAgentInfo = navigator.userAgent.toLowerCase(); var Agents = ne ...

  8. js判断undefined类型

    js判断undefined类型 if (reValue== undefined){    alert("undefined");    }  发现判断不出来,最后查了下资料要用ty ...

  9. js判断只能输入数字和只能输入

    JS判断只能是数字和小数点 1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'' ...

随机推荐

  1. JHipster生成微服务架构的应用栈(五)- 容器编排示例

    本系列文章演示如何用JHipster生成一个微服务架构风格的应用栈. 环境需求:安装好JHipster开发环境的CentOS 7.4(参考这里) 应用栈名称:appstack 认证微服务: uaa 业 ...

  2. mac 全角/半角标点符号切换

    快捷键:option+shift+H 背景是这样的,前段时间sublimeText新装了HTML/CSS/JS Prittify,JS代码格式化的快捷键是:command+shift+H. 记性有点差 ...

  3. github提交代码失败

    向github上面提交代码,提示代码里面有大文件,建议使用git-lfs. 1,安装git-lfs yum install git-lfs 2,配置需要追踪的打文件(由于我这里提交的是jar包) gi ...

  4. java 结合反射、泛型、注解获取泛型对象

    由于自己也不是特别的理解,不能做过多的解释,因为这些是问过老师做出来的,我还没有学到这里.如果有解释错误的 指出来我改正一下.见谅~(如果学到这里了,会完善) 工具类(SQLUtil)核心代码: pa ...

  5. C语言 一个数学问题:求s=(a^m)!+(b^n)!

    求s=(am)!+(bn)! //凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ #include<stdio.h> void main(){ i ...

  6. 力扣算法题—052N皇后问题2

    跟前面的N皇后问题没区别,还更简单 #include "000库函数.h" //使用回溯法 class Solution { public: int totalNQueens(in ...

  7. 【工具大道】使用SSH远程登录Mac 电脑

    本文地址 一.打开ssh Mac Terminal是自带SSH的,可以用whereis来看看: $ whereis ssh 但是在现有进程中找不到ssh对应的进程: $ ps aux | grep s ...

  8. SQLite中的WAL机制详细介绍-与回滚日志原理

    一.什么是WAL? WAL的全称是Write Ahead Logging,它是很多数据库中用于实现原子事务的一种机制,SQLite在3.7.0版本引入了该特性. 二.WAL如何工作? 在引入WAL机制 ...

  9. centos7下kubernetes(6。kubernetes创建资源的两种方式)

    两种方式:1.命令:2.配置文件 之前我们在部署K8S的时候分别用到了命令和配置文件创建K8s资源: 1.命令方式:kubectl run nginx-deployment --image=nginx ...

  10. docker-machine on azure

    1.准备Azure的虚拟机,安装docker-machine 由于azure虚拟机的管理员账号不是root,所以这里我们使用自己创建的管理员yy 1.base=https://github.com/d ...