利用jQuery插件扩展识别浏览器内核与外壳的类型和版本的实现代码


Posted in Javascript onOctober 22, 2011

尤其是在当今各种浏览器满天飞(据说仅以IE为内核的浏览器就有200种之多)。

小弟今天写了个基于jQuery的插件扩展,主要用于识别浏览器内核与外壳的类型和版本。可识别各种浏览器的内核,并已经支持多种国内主流浏览器。

费话不多说,上我的JavaScript代码:(文件名:jquery.browsertype-1.0.js)

/** 
* jQuery插件开发方法二:第一步:插件定义 
*/ 
jQuery.myPlugin = { 
//获得浏览器的内核与外壳的类型和版本 
Client: function (){ 
//浏览器内核类型(只有五种) 
var engine = { ie:0, webkit:0, gecko:0, opera:0, khtml:0 }; 
//浏览器外壳类型(国内常见的浏览器有:360浏览器、傲游、腾讯QQ\TT浏览器、世界之窗、彗星浏览器、绿色浏览器、传统IE、谷歌Chrome、网景netscape、火狐、Opera、苹果Safari等等) 
var shell = { se360:0, se:0, maxthon:0, qq:0, tt:0, theworld:0, cometbrowser:0, greenbrowser:0, ie:0, chrome:0, netscape:0, firefox:0, opera:0, safari:0, konq:0 }; 
//获得客户端浏览器的信息 
var ua = navigator.userAgent.toLowerCase(); 
for (var type in engine) { 
if (typeof type === 'string') { 
var regexp = 'gecko' === type ? /rv:([\w.]+)/ : RegExp(type + '[ \\/]([\\w.]+)'); 
if (regexp.test(ua)){ 
engine.version = window.opera ? window.opera.version() : RegExp.$1;//浏览器内核版本 
engine[type] = parseFloat(engine.version); 
engine.type = type;//浏览器内核类型 
break; 
} 
} 
} 
for (var type in shell) { 
if (typeof type === 'string') { 
var regexp = null; 
switch(type) { 
case "se360": regexp = /360se(?:[ \/]([\w.]+))?/; break; 
case "se": regexp = /se ([\w.]+)/; break; 
case "qq": regexp = /qqbrowser\/([\w.]+)/; break; 
case "tt": regexp = /tencenttraveler ([\w.]+)/; break; 
case "safari": regexp = /version\/([\w.]+)/; break; 
case "konq": regexp = /konqueror\/([\w.]+)/; break; 
case "netscape": regexp = /navigator\/([\w.]+)/; break; 
default: regexp = RegExp(type + '(?:[ \\/]([\\w.]+))?'); 
} 
if (regexp.test(ua)) { 
shell.version = window.opera ? window.opera.version() : RegExp.$1 ? RegExp.$1 : 'unknown';//浏览器外壳版本 
shell[type] = parseFloat(shell.version); 
shell.type = type;//浏览器外壳类型 
break; 
} 
} 
} 
//返回浏览器内核与外壳的类型和版本:engine为内核,shell为外壳 
return { engine: engine, shell: shell }; 
} 
}; 
/** 
* jQuery插件开发方法二:第二步:执行插件 
* jQuery.myBrowser插件:获得浏览器的内核与外壳的类型和版本 
* 使用示例: 
* (1)浏览器内核:alert("您的浏览器信息如下:\n内核类型:"+jQuery.myBrowser.engine.type+",内核版本:"+jQuery.myBrowser.engine.version); 
* (2)浏览器外壳:alert("您的浏览器信息如下:\n外壳类型:"+jQuery.myBrowser.shell.type+",外壳版本:"+jQuery.myBrowser.shell.version); 
*/ 
jQuery.myBrowser = jQuery.myPlugin.Client();

使用示例:(test.html)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>获得浏览器的信息</title> 
<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
google.load("jquery", "1.4.2"); 
google.load("jqueryui", "1.7.2"); 
</script> 
<script type="text/javascript" src="jquery.browsertype-1.0.js"></script> 
<script type="text/javascript"> 
alert("您的浏览器信息如下:\n内核类型:"+jQuery.myBrowser.engine.type+",内核版本:"+jQuery.myBrowser.engine.version); 
alert("您的浏览器信息如下:\n外壳类型:"+jQuery.myBrowser.shell.type+",外壳版本:"+jQuery.myBrowser.shell.version); 
document.writeln("您的浏览器内核类型 ——>"+jQuery.myBrowser.engine.type+":"+jQuery.myBrowser.engine.version+"<br>"); 
document.writeln("您的浏览器外壳类型 ——>"+jQuery.myBrowser.shell.type+":"+jQuery.myBrowser.shell.version+"<br>"); 
</script> 
</head> 
<body> 
<br/>测试浏览器的内核与外壳的类型和版本:<br/> 
</body> 
</html>
Javascript 相关文章推荐
jQuery.ajax 用户登录验证代码
Oct 29 Javascript
js自动生成对象的属性示例代码
Oct 28 Javascript
一个字符串反转函数可实现字符串倒序
Sep 15 Javascript
2014年50个程序员最适用的免费JQuery插件
Dec 15 Javascript
jquery实现的淡入淡出下拉菜单效果
Aug 25 Javascript
jQuery实现标签页效果实战(4)
Feb 08 Javascript
Vue2.0 UI框架ElementUI使用方法详解
Apr 14 Javascript
vue mixins组件复用的几种方式(小结)
Sep 06 Javascript
Vue SSR 组件加载问题
May 02 Javascript
微信小程序实现topBar底部选择栏效果
Jul 20 Javascript
vue router 传参获取不到的解决方式
Nov 13 Javascript
javaScript Array api梳理
Mar 31 Javascript
js两行代码按指定格式输出日期时间
Oct 21 #Javascript
jQuery中live方法的重复绑定说明
Oct 21 #Javascript
jquery(live)中File input的change方法只起一次作用的解决办法
Oct 21 #Javascript
jQuery EasyUI API 中文文档 - NumberSpinner数值微调器使用介绍
Oct 21 #Javascript
jQuery EasyUI API 中文文档 - Spinner微调器使用
Oct 21 #Javascript
JavaScript闭包 懂不懂由你反正我是懂了
Oct 21 #Javascript
深入理解JavaScript作用域和作用域链
Oct 21 #Javascript
You might like
重置版游戏视频
2020/04/09 魔兽争霸
一些常用的php简单命令代码集锦
2007/09/24 PHP
apache rewrite_module模块使用教程
2008/01/10 PHP
IIS6+PHP5+MySQL5+Zend Optimizer+phpMyAdmin安装配置图文教程 2009年
2009/06/08 PHP
PHP操作XML作为数据库的类
2010/12/19 PHP
使用php实现截取指定长度
2013/08/06 PHP
PHP5.3与5.5废弃与过期函数整理汇总
2014/07/10 PHP
Yii框架获取当前controlle和action对应id的方法
2014/12/03 PHP
php中实现xml与mysql数据相互转换的方法
2014/12/25 PHP
thinkphp如何获取客户端IP
2015/11/03 PHP
详解PHP处理密码的几种方式
2016/11/30 PHP
Laravel构建即时应用的一种实现方法详解
2017/08/31 PHP
PHPStudy下如何为Apache安装SSL证书的方法步骤
2019/01/23 PHP
thinkphp框架无限级栏目的排序功能实现方法示例
2020/03/29 PHP
通过DOM脚本去设置样式信息
2010/09/19 Javascript
仿百度输入框智能提示的js代码
2013/08/22 Javascript
javascript Deferred和递归次数限制实例
2014/10/21 Javascript
xmlplus组件设计系列之按钮(2)
2017/04/26 Javascript
对于js垃圾回收机制的理解
2017/09/14 Javascript
ES6学习教程之块级作用域详解
2017/10/09 Javascript
layDate插件设置开始和结束时间
2018/11/15 Javascript
VUE 实现复制内容到剪贴板的两种方法
2019/04/24 Javascript
vue实现路由切换改变title功能
2019/05/28 Javascript
vue.js实现数据库的JSON数据输出渲染到html页面功能示例
2019/08/03 Javascript
python的dict,set,list,tuple应用详解
2014/07/24 Python
Python进阶之全面解读高级特性之切片
2019/02/19 Python
python 计算两个列表的相关系数的实现
2019/08/29 Python
jupyter notebook 写代码自动补全的实现
2020/11/02 Python
一文读懂python Scrapy爬虫框架
2021/02/24 Python
简洁自适应404页面HTML好看的404源码
2020/12/16 HTML / CSS
网络安全方面的面试题
2015/11/04 面试题
校园安全广播稿
2014/02/08 职场文书
表彰会主持词
2014/03/26 职场文书
2014县委书记党的群众路线教育实践活动对照检查材料思想汇报
2014/09/22 职场文书
违反单位工作制度检讨书
2014/10/25 职场文书
2014年机关工会工作总结
2014/12/19 职场文书