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 相关文章推荐
jQuery autocomplete插件修改
Apr 17 Javascript
改善你的jQuery的25个步骤 千倍级效率提升
Feb 11 Javascript
图片轮换效果实现代码(点击按钮停止执行)
Apr 12 Javascript
利用百度地图JSAPI生成h7n9禽流感分布图实现代码
Apr 15 Javascript
node.js中的fs.existsSync方法使用说明
Dec 17 Javascript
angularJS中$apply()方法详解
Jan 07 Javascript
java必学必会之static关键字
Dec 03 Javascript
jQuery+Ajax实现限制查询间隔的方法
Jun 07 Javascript
JS公共小方法之判断对象是否为domElement的实例
Nov 25 Javascript
微信小程序 滚动到某个位置添加class效果实现代码
Apr 19 Javascript
js 索引下标之li集合绑定点击事件
Jan 12 Javascript
JavaScript计算出两个数的差值
Mar 19 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中的 == 运算符进行字符串比较
2006/11/26 PHP
destoon实现底部添加你是第几位访问者的方法
2014/07/15 PHP
php站内搜索关键词变亮的实现方法
2014/12/30 PHP
教大家制作简单的php日历
2015/11/17 PHP
PHP用户注册邮件激活账户的实现代码
2017/05/31 PHP
几行代码轻松搞定jquery实现flash8类似的连接效果
2007/05/03 Javascript
Node.js模块加载详解
2014/08/16 Javascript
jQuery实现360°全景拖动展示
2015/03/18 Javascript
js限制input标签中只能输入中文
2015/06/26 Javascript
最简单纯JavaScript实现Tab标签页切换的方式(推荐)
2016/07/25 Javascript
Angularjs中$http以post请求通过消息体传递参数的实现方法
2016/08/05 Javascript
Angular4 中内置指令的基本用法
2017/07/31 Javascript
vue服务端渲染的实例代码
2017/08/28 Javascript
AngularJS 的$timeout服务示例代码
2017/09/21 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
2019/08/16 Javascript
ant design实现圈选功能
2019/12/17 Javascript
vue学习笔记之过滤器的基本使用方法实例分析
2020/02/01 Javascript
vue实现图片懒加载的方法分析
2020/02/05 Javascript
如何通过vscode运行调试javascript代码
2020/07/24 Javascript
vue使用vue-quill-editor富文本编辑器且将图片上传到服务器的功能
2021/01/13 Vue.js
使用Python的Twisted框架编写简单的网络客户端
2015/04/16 Python
win与linux系统中python requests 安装
2016/12/04 Python
Python实现自动登录百度空间的方法
2017/06/10 Python
python实现微信自动回复功能
2018/04/11 Python
Python单向链表和双向链表原理与用法实例详解
2018/08/31 Python
Python基础之条件控制操作示例【if语句】
2019/03/23 Python
python使用turtle绘制国际象棋棋盘
2019/05/23 Python
Python使用Opencv实现边缘检测以及轮廓检测的实现
2020/12/31 Python
如何利用input事件来监听移动端的输入
2016/04/15 HTML / CSS
简历的自我评价范文
2014/02/04 职场文书
2014年档案室工作总结
2014/12/01 职场文书
导游词之寿县报恩寺
2020/01/19 职场文书
使用HTML+Css+transform实现3D导航栏的示例代码
2021/03/31 HTML / CSS
MySQL CHAR和VARCHAR该如何选择
2021/05/31 MySQL
漫画「古见同学有交流障碍症」第25卷封面公开
2022/03/21 日漫
Java无向树分析 实现最小高度树
2022/04/09 Javascript