Navigator 对象包含有关浏览器的信息。

很多时候我们需要在判断网页所处的浏览器和平台,Navigator为我们提供了便利

Navigator常见的对象属性如下:

属性 描述
appCodeName 返回浏览器的代码名。
appMinorVersion 返回浏览器的次级版本。
appName 返回浏览器的名称。
appVersion 返回浏览器的平台和版本信息。
browserLanguage 返回当前浏览器的语言。
cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值。
cpuClass 返回浏览器系统的 CPU 等级。
onLine 返回指明系统是否处于脱机模式的布尔值。
platform 返回运行浏览器的操作系统平台。
systemLanguage 返回 OS 使用的默认语言。
userAgent 返回由客户机发送服务器的 user-agent 头部的值。
userLanguage 返回 OS 的自然语言设置。

我们使用的比较多的是他的userAgent,经常需要判断的情况有:

(1)PC还是移动端

(2)安卓还是IOS

(3)浏览器的类型

示例代码:

 var browser={
versions:function(){
var u = navigator.userAgent, app = navigator.appVersion;
return { //移动终端浏览器版本信息
  trident: u.indexOf('Trident') > -1, //IE内核
  presto: u.indexOf('Presto') > -1, //opera内核
  webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
  gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
  mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
  ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
  android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
  iPhone: u.indexOf('iPhone') > -1 , //是否为iPhone或者QQHD浏览器
  iPad: u.indexOf('iPad') > -1, //是否iPad
  webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
}

判断是否移动端

 if(browser.versions.mobile){
console.log('我是移动端');
}

还可以用另一种方式判断

 var s=document.hasOwnProperty("ontouchstart");//电脑返回false,手机为true
console.log(s);

判断安卓还是IOS

 if(browser.versions.ios){
console.log('我是IOS');
}
if(browser.version.andriod){
console.log('我是安卓');
}

判断浏览器的类型

 if(browser.versions.trident){
console.log('我是IE');
}
if(browser.versions.presto){
console.log('我是opera');
}
if(browser.versions.webKit){
console.log('我是苹果和谷歌');
}
if(browser.versions.gecko){
console.log('我是火狐');
}

JS中的Navigator 对象的更多相关文章

  1. js中的navigator对象

    Navigator 对象包含有关浏览器的信息.所有浏览器都支持该对象 在控制台中输出相关信息的代码 <script> console.log(navigator); </script ...

  2. JS中的event 对象详解

    JS中的event 对象详解   JS的event对象 Event属性和方法:1. type:事件的类型,如onlick中的click:2. srcElement/target:事件源,就是发生事件的 ...

  3. js中两个对象的比较

    代码取自于underscore.js 1.8.3的isEqual函数. 做了一些小小的修改,主要是Function的比较修改. 自己也加了一些代码解读. <!DOCTYPE html> & ...

  4. MVC中处理Json和JS中处理Json对象

    MVC中处理Json和JS中处理Json对象 ASP.NET MVC 很好的封装了Json,本文介绍MVC中处理Json和JS中处理Json对象,并提供详细的示例代码供参考. MVC中已经很好的封装了 ...

  5. js中的json对象详细介绍

    JSON一种简单的数据格式,比xml更轻巧,在JavaScript中处理JSON数据不需要任何特殊的API或工具包,下面为大家详细介绍下js中的json对象, 1.JSON(JavaScript Ob ...

  6. JavaScript -- 时光流逝(五):js中的 Date 对象的方法

    JavaScript -- 知识点回顾篇(五):js中的 Date 对象的方法 Date 对象: 用于处理日期和时间. 1. Date对象的方法 <script type="text/ ...

  7. JavaScript -- 时光流逝(四):js中的 Math 对象的属性和方法

    JavaScript -- 知识点回顾篇(四):js中的 Math 对象的属性和方法 1. Math 对象的属性 (1) E :返回算术常量 e,即自然对数的底数(约等于2.718). (2) LN2 ...

  8. JavaScript -- 时光流逝(三):js中的 String 对象的方法

    JavaScript -- 知识点回顾篇(三):js中的 String 对象的方法 (1) anchor(): 创建 HTML 锚. <script type="text/javasc ...

  9. js中 给json对象添加属性和json数组添加元素

    js中 给json对象添加新的属性 比如现在有一个json对象为jsonObj,需要给这个对象添加新的属性newParam,同时给newParam赋值为pre.做法如下: var obj={ &quo ...

随机推荐

  1. jQuery 的 ajax

    jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. $(selector).load ...

  2. SQL 查询学生缺考情况

    有三个表,如果学生缺考,那么在成绩表中就不存在这个学生的这门课程成绩的记录,写一段SQL语句,检索出每个学生缺考的科目.A 学生表(student)字段1 学生号(s_id)字段2 学生名(s_nam ...

  3. 关于Fragment 不响应onActivityResult的情况分析 (

    大家都知道,可以通过使用 startActivityForResult() 和 onActivityResult() 方法来传递或接收参数. 但你是否遭遇过onActivityResult()不执行或 ...

  4. android 判断屏幕是否亮着

    PowerManager pm = (PowerManager) context.getSystemService(Context.POWER_SERVICE); boolean screen = p ...

  5. [转]一些NSArray,NSDictionary,NSSet相关的算法知识

    iOS编程当中的几个集合类:NSArray,NSDictionary,NSSet以及对应的Mutable版本,应该所有人都用过.只是简单使用的话,相信没人会用错,但要做到高效(时间复杂度)精确(业务准 ...

  6. UISegmentedControl的使用

    #import "SegmentedControlTestViewController.h" @implementation SegmentedControlTestViewCon ...

  7. SSH整合简述一

    1.web.xml中配置 struts2过滤器 <filter> <filter-name>struts2</filter-name> <filter-cla ...

  8. IOS CALayer(一)

    对于一个app的好坏,我们首要判断的便是app的界面,而界面的建立则是在图形的处理基础上的,说到图形处理又不得不提及Quartz2D,CALayer. 在iOS系统中,你能看得见摸得着的东西基本上都是 ...

  9. 解决easy ui两次请求服务器的问题

    目前该问题已经在1.4.1版本中解决了 本文引用自:http://www.cnblogs.com/Reaver/p/4056770.html,原文博主:flyreaver 我在使用过程中遇到了easy ...

  10. struts2 redirect 配置动态传递参数

    <action name="actionName" class="com.towerking.TestAction" method="execu ...