javascript 的navigator属性,不常用,但是用处也不少,主要用处是在做浏览器兼容的问题的时候,现在有的网站已经不兼容IE6,用户假如用IE6浏览网页的话,会提示浏览器升级等信息。或者判断是手机用户还是电脑用户,手机用户调整至手机网站,电脑用户之间跳转至电脑网页等等。

首先我们来谈谈navigator属性。

你可以在自己电脑上,用复制如下信息,运行一下,看看:

  1. var x = navigator;
  2. document.write("CodeName=" + x.appCodeName);
  3. document.write("<br />");
  4. document.write("MinorVersion=" + x.appMinorVersion);
  5. document.write("<br />");
  6. document.write("Name=" + x.appName);
  7. document.write("<br />");
  8. document.write("Version=" + x.appVersion);
  9. document.write("<br />");
  10. document.write("CookieEnabled=" + x.cookieEnabled);
  11. document.write("<br />");
  12. document.write("CPUClass=" + x.cpuClass);
  13. document.write("<br />");
  14. document.write("OnLine=" + x.onLine);
  15. document.write("<br />");
  16. document.write("Platform=" + x.platform);
  17. document.write("<br />");
  18. document.write("UA=" + x.userAgent);
  19. document.write("<br />");
  20. document.write("BrowserLanguage=" + x.browserLanguage);
  21. document.write("<br />");
  22. document.write("SystemLanguage=" + x.systemLanguage);
  23. document.write("<br />");
  24. document.write("UserLanguage=" + x.userLanguage);

我的电脑的运行结果如下:

  1. CodeName=Mozilla
  2. MinorVersion=undefined
  3. Name=Netscape
  4. Version=5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36
  5. CookieEnabled=true
  6. CPUClass=undefined
  7. OnLine=true
  8. Platform=Win32
  9. UA=Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36
  10. BrowserLanguage=undefined
  11. SystemLanguage=undefined
  12. UserLanguage=undefined

对照一下即可一目了然。

根据上面的navigator属性,我们可以来判断浏览器版本了,下面我们一起来做一个例子:

页面在IE7一下,提示浏览器升级,其他浏览器正常浏览

可以写如下代码:

  1. if(window.ActiveXObject)
  2. {
  3. var browser=navigator.appName
  4. var b_version=navigator.appVersion
  5. var version=b_version.split(";");
  6. var trim_Version=version[1].replace(/[ ]/g,"");
  7. if(browser=="Microsoft Internet Explorer" && trim_Version=="MSIE6.0" || trim_Version=="MSIE7.0" )
  8. {
  9. $(".ie7andie6").show();
  10. $(".contentnone").hide();
  11. }
  12. }

html我们可以这么写:

  1. <div class="contentnone" style="margin-top:30px;text-align: center;font-size:18px;">各位亲们,大家好,我在IE8以上可以正常浏览啊!</div>
  2.  
  3. <div class="ie7andie6 mod-main" style="display:none;">
  4. <div class=tip>
  5. <p>您使用的浏览器版本较低,建议您换用下面这些浏览器试试吧。</p>
  6. </div>
  7. <ul class="clr mod-browsers">
  8. <li><A class=chrome href="http://www.google.cn/intl/zh-CN/chrome/" target=_blank>Chrome</A> </li>
  9. <li><A class=ie href="http://windows.microsoft.com/zh-cn/internet-explorer/ie-10-worldwide-languages" target=_blank>IE10</A> </li>
  10. <li><A class=ff href="http://firefox.com.cn/" target=_blank>Firefox</A> </li>
  11. </ul>
  12. <div class=switch-pic></div>
  13. </div>

IE8及其别的版本就可以正常浏览了!

另外你也可以用这个方法来判断是手机端用户还是电脑用户:

  1. var a=navigator.userAgent;
  2. if(a.indexOf("Android")!=-1 || a.indexOf("iPhone")!=-1 || a.indexOf("iPad")!=-1 ){
  3.  
  4. //跳转到手机网站
  5.  
  6. }
    //tips: 也可以用try catch 对手机特有的touch事件监测,如果支持这些事件就可以跳转到H5页面;

 

js 判断安卓或者ios 之indexOf方式:

  1. //判断访问终端
  2. var browser={
  3. versions:function(){
  4. var u = navigator.userAgent, app = navigator.appVersion;
  5. return {
  6. trident: u.indexOf('Trident') > -1, //IE内核
  7. presto: u.indexOf('Presto') > -1, //opera内核
  8. webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
  9. gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,//火狐内核
  10. mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
  11. ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
  12. android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
  13. iPhone: u.indexOf('iPhone') > -1 , //是否为iPhone或者QQHD浏览器
  14. iPad: u.indexOf('iPad') > -1, //是否iPad
  15. webApp: u.indexOf('Safari') == -1, //是否web应该程序,没有头部与底部
  16. weixin: u.indexOf('MicroMessenger') > -1, //是否微信 (2015-01-22新增)
  17. qq: u.match(/\sQQ/i) == " qq" //是否QQ
  18. };
  19. }(),
  20. language:(navigator.browserLanguage || navigator.language).toLowerCase()
  21. }

使用方法:

  1. //判断是否IE内核
  2. if(browser.versions.trident){ alert("is IE"); }
  3. //判断是否webKit内核
  4. if(browser.versions.webKit){ alert("is webKit"); }
  5. //判断是否移动端
  6. if(browser.versions.mobile||browser.versions.android||browser.versions.ios){ alert("移动端"); }

js 判断安卓或者ios 之正则表达式方式:

  1. if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
  2. //alert(navigator.userAgent);
  3. //苹果端
  4. } else if (/(Android)/i.test(navigator.userAgent)) {
  5. //alert(navigator.userAgent);
  6. //安卓端
  7. } else {
  8. //pc端
  9. };

js 判断微信访问页面:

  1. var ua= navigator.userAgent.toLowerCase();
  2. if(ua.match(/MicroMessenger/i)=="micromessenger") {
  3. alert("is wechat");
  4. }

  

通过浏览器navigator判断浏览器版本或者手机类型&&判断微信访问的更多相关文章

  1. Cocos Creator (JavaScript手机类型判断)

    手机类型判断 var BrowserInfo = { userAgent: navigator.userAgent.toLowerCase() isAndroid: Boolean(navigator ...

  2. 使用window.navigator.userAgent属性判断浏览器类型及版本

    使用window.navigator.userAgent属性判断浏览器类型及版本 2011-12-11 22:03:11 window.navigator.userAgent属性包含了浏览器类型.版本 ...

  3. javascript判断浏览器的版本

    在javascript中直接的使用navigator.userAgent就可以获取当前浏览器的版本等信息,以下是列出来的关于不同浏览器显示的值(Windows.Android.iPhone): IE6 ...

  4. js判断移动终端(手机浏览器)

    方法1: <script type="text/javascript">         var browser = {             versions: f ...

  5. JavaScript 判断浏览器及版本

    /* 智能机浏览器版本信息: alert("语言版本: "+browser.language); alert(" 是否为移动终端: "+browser.vers ...

  6. js判断浏览器类型以及浏览器版本

    判断浏览器类型:   if navigator.userAgent.indexOf(”MSIE”)>0) {} //判断是否IE浏览器 if(isFirefox=navigator.userAg ...

  7. JQuery 判断浏览器及其版本

    JQuery 中用 方法 jQuery.browser 来判断浏览器,返回值可以为: safari opera msie mozilla. 当然有时候我们还需要区分版本 这就要用到 jQuery.br ...

  8. js/jQuery判断浏览器名称、内核版本、浏览器壳

    1.js方法 /* 判断浏览器名称和版本 目前只能判断:ie/firefox/chrome/opera/safari 2012年5月16日23:47:08 浏览器内核UA:UA; 浏览器内核名称:NV ...

  9. js实现判断浏览器版本

    //判断浏览器版本是否过低 var ua = navigator.userAgent.toLowerCase(); if (window.ActiveXObject) var IEversion = ...

随机推荐

  1. 基本的dom操作方法

    childNodes 返回当前元素所有子元素的数组firstChild 返回当前元素的第一个下级子元素lastChild 返回当前元素的最后一个子元素nextSibling 返回紧跟在当前元素后面的元 ...

  2. ural1628 White Streaks

    White Streaks Time limit: 1.0 secondMemory limit: 64 MB The life of every unlucky person has not onl ...

  3. java SWT嵌入IE,SafeArray .

    java SWT嵌入IE,SafeArray );    // Create a by ref variant    Variant variantByRef = new Variant(pVaria ...

  4. Hibernate---第一个helloworld程序 (XML版本, annotation版本)

    Hibernate作为JPA的一种实现,jpa的注解已经是hibernate的核心,hibernate只提供了一些补充,而不是两套注解.hibernate对jpa的支持够足量,在使用hibernate ...

  5. MAC使用GITHUB

    作者:珊姗是个小太阳链接:https://www.zhihu.com/question/20070065/answer/79557687来源:知乎著作权归作者所有,转载请联系作者获得授权. #什么是 ...

  6. WPF教程:附加属性

    一.附加属性的特点1.特殊的依赖属性2.用于非定义该属性的类 例如Grid面板的RowDefinition.ColumnDefinition.Canvas面板的Left.RightDockPanel面 ...

  7. hibernate---性能优化, 1+N问题

    session级缓存 保存一个hashmap, 读出来的对象放在里面, 如果读出来50条放50条, 如果另起session原来的50条就被清除.可以手动session.clear清除. 如果同一个se ...

  8. js局部变量,参数

    作者:zccst 所有函数的参数都是按值传递的.也就是说,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样.基本类型值的传递如同基本类型变量的赋值一样.而引用类型值的传递,则 ...

  9. uos事件控制块与任务同步

    Ucos为了任务之间的通讯定义了信号量,互斥性信号量,消息对象 消息队列等结构以及api,为了统一的管理这些同步,定义了一个结构叫做时间控制块OS_EVENT,如下 typedef struct os ...

  10. LPC1788 nand驱动

    Lpc 1788自带有emc接口用于驱动nandflash,norflash,sdram设备,对于nandflash驱动因为配置简单,时序也简单 首先,针对nandflash而言应当在系统中有三个地址 ...