jquery判断浏览器类型的代码


Posted in Javascript onNovember 05, 2012

Jquery中利用navigator.userAgent.indexOf来判断浏览器类型,并进行了一下处理,建议学习Jquery的朋友学习下,了解一下思路。

主要使用的方法:$.browser.['浏览器关键字']

$(function() { 
if($.browser.msie) { 
alert("this is msie"); 
} else if($.browser.safari) { 
alert("this is safari!"); 
} else if($.browser.mozilla) { 
alert("this is mozilla!"); 
} else if($.browser.opera) { 
alert("this is opera"); 
} else { 
alert("i don't konw!"); 
}

我们看下jQuery的源码:
var userAgent = navigator.userAgent.toLowerCase(); 
// Figure out what browser is being used 
jQuery.browser = { 
version: (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [])[1], 
safari: /webkit/.test( userAgent ), 
opera: /opera/.test( userAgent ), 
msie: /msie/.test( userAgent ) && !/opera/.test( userAgent ), 
mozilla: /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent ) 
};

Jquery 使用的是通过正则来匹配userAgent判断浏览器的种类和版本.
version---浏览器版本
msie----ie浏览器(Microsoft Internet Explorer)
mozilla-火狐浏览器
opera--opera浏览器

如果我们要来判断当前浏览器是否是IE6应该如何来判断?

if($.browser.msie&&($.browser.version == "6.0")&&!$.support.style){ 
alert("ie6"); 
}

同样Jquery判断浏览器是否为IE7
if($.browser.msie&&($.browser.version == "7.0")){ 
alert("ie7"); 
}

如果不想使用Jquery,稍为修改下代码就可以为自己所用Js代码:
var userAgent = navigator.userAgent.toLowerCase(); 
browser={ 
version: (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [0,'0'])[1], 
safari: /webkit/.test( userAgent ), 
opera: /opera/.test( userAgent ), 
msie: /msie/.test( userAgent ) && !/opera/.test( userAgent ), 
mozilla: /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent ) 
}

调用的时候和jquery一样,只不过把$符号取掉就行了

如果是为了判断IE的版本我还是推荐用IE的条件表达式来书写JS

<!--[if IE]> 
<script type="text/javascript"> 
alert("ie"); 
</script> 
<![endif]--> 
<!--[if IE 6]> 
<script type="text/javascript"> 
alert("ie6"); 
</script> 
<![endif]--> 
<!--[if IE 7]> 
<script type="text/javascript"> 
alert("ie7"); 
</script> 
<![endif]-->

这个比我们手动通过$.browser来判断IE版本更精准,也不用去记jquery的browser的使用方法了
Javascript 相关文章推荐
Prototype 工具函数 学习
Jul 23 Javascript
你必须知道的Javascript知识点之&quot;深入理解作用域链&quot;的介绍
Apr 23 Javascript
js实现input密码框提示信息的方法(附html5实现方法)
Jan 14 Javascript
jquery zTree异步加载、模糊搜索简单实例分享
Mar 24 Javascript
jQuery操作css样式
May 15 jQuery
详解AngularJS 模块化
Jun 14 Javascript
JS返回顶部实例代码
Aug 09 Javascript
js 实现ajax发送步骤过程详解
Jul 25 Javascript
vue项目中使用AES实现密码加密解密(ECB和CBC两种模式)
Aug 12 Javascript
vue 实现v-for循环回来的数据动态绑定id
Nov 07 Javascript
Element Popover 弹出框的使用示例
Jul 26 Javascript
解决Antd Table组件表头不对齐的问题
Oct 27 Javascript
js实现翻页后保持checkbox选中状态的实现方法
Nov 03 #Javascript
JS事件Event元素(兼容IE,Firefox,Chorme)
Nov 01 #Javascript
js限制textarea每行输入字符串长度的代码
Oct 31 #Javascript
JS TextArea字符串长度限制代码集合
Oct 31 #Javascript
JS 控件事件小结
Oct 31 #Javascript
jQuery事件 delegate()使用方法介绍
Oct 30 #Javascript
fancybox modal的完美解决(右上的X)
Oct 30 #Javascript
You might like
php上传文件中文文件名乱码的解决方法
2013/11/01 PHP
详解php中的implements 使用
2017/06/13 PHP
jQuery的初始化与对象构建之浅析
2011/04/12 Javascript
javascript数组去掉重复
2011/05/12 Javascript
JavaScript在IE和FF下的兼容性问题
2014/05/19 Javascript
jquery 将当前时间转换成yyyymmdd格式的实现方法
2016/06/01 Javascript
微信小程序 wxapp视图容器 view详解
2016/10/31 Javascript
JSON字符串和JSON对象相互转化实例详解
2017/01/05 Javascript
求js数组的最大值和最小值的四种方法
2017/03/03 Javascript
node中koa中间件机制详解
2017/08/22 Javascript
原生javascript实现的全屏滚动功能示例
2017/09/19 Javascript
mac中利用NVM管理不同node版本的方法详解
2017/11/08 Javascript
解决JavaScript layui 下拉框不显示的问题
2018/08/14 Javascript
JS+html5实现异步上传图片显示上传文件进度条功能示例
2019/11/09 Javascript
vue动态渲染svg、添加点击事件的实现
2020/03/13 Javascript
Python 检查数组元素是否存在类似PHP isset()方法
2014/10/14 Python
python动态性强类型用法实例
2015/05/09 Python
python中实现精确的浮点数运算详解
2017/11/02 Python
Python模拟自动存取款机的查询、存取款、修改密码等操作
2018/09/02 Python
Python 调用PIL库失败的解决方法
2019/01/08 Python
一文轻松掌握python语言命名规范规则
2020/06/18 Python
Python工程师必考的6个经典面试题
2020/06/28 Python
keras在构建LSTM模型时对变长序列的处理操作
2020/06/29 Python
德国净水壶和滤芯品牌:波尔德PearlCo(家用净水器)
2020/04/29 全球购物
关联、聚合(Aggregation)以及组合(Composition)的区别
2012/02/29 面试题
C#中有没有静态构造函数,如果有是做什么用的?
2016/06/04 面试题
工程管理专业个人求职信范文
2013/12/07 职场文书
申请任职学生会干部自荐书范文
2014/02/13 职场文书
《最后的姿势》教学反思
2014/02/27 职场文书
工作作风承诺书
2014/08/30 职场文书
政风行风整改方案
2014/10/25 职场文书
优秀班主任主要事迹材料
2014/12/16 职场文书
2015庆祝七一建党节94周年活动总结
2015/03/20 职场文书
导游带团欢迎词
2015/09/30 职场文书
pytorch 使用半精度模型部署的操作
2021/05/24 Python
JavaScript parseInt0.0000005打印5原理解析
2022/07/23 Javascript