使用js检测浏览器的实现代码


Posted in Javascript onMay 14, 2013

在写跨浏览器的js程序中,检测浏览器是一个很重要的工作。我们不时要为不同的浏览器写分支代码。
如下是一种:

//添加事件工具函数
function addEvent(el,type,handle){
    if(el.addEventListener){//for standard browses
        el.addEventListener(type,handle,false);
    }else if(el.attachEvent){//for IE
        el.attachEvent("on"+event,handle);
    }else{//other
        el["on"+type]=handle;
    }
}

1,第一种检测浏览器方式称为 user-agent 检测方式。是最古老的,它检测目标浏览器的确切型号,包括浏览器的名称和版本。其实就是一个字符串,用navigator.userAgen或navigator.appName获取。如下:
function isIE(){
    return navigator.appName.indexOf("Microsoft Internet Explorer")!=-1 && document.all;
}
function isIE6() {
    return navigator.userAgent.split(";")[1].toLowerCase().indexOf("msie 6.0")=="-1"?false:true;
}
function isIE7(){
    return navigator.userAgent.split(";")[1].toLowerCase().indexOf("msie 7.0")=="-1"?false:true;
}
function isIE8(){
    return navigator.userAgent.split(";")[1].toLowerCase().indexOf("msie 8.0")=="-1"?false:true;
}
function isNN(){
    return navigator.userAgent.indexOf("Netscape")!=-1;
}
function isOpera(){
    return navigator.appName.indexOf("Opera")!=-1;
}
function isFF(){
    return navigator.userAgent.indexOf("Firefox")!=-1;
}
function isChrome(){
    return navigator.userAgent.indexOf("Chrome") > -1;  
}

2,第二种称为 对象/特征 检测方式,这是一种判断浏览器能力的方式,也是目前流行的方式。即在使用一个对象之前检测它是否存在。上面提到的addEvent方法中就使用了该方式。.addEventListener是w3c dom标准方式,而IE使用自己特有attachEvent。以下列举几个:

a,talbe.cells只有IE/Opera支持。

b,innerText/insertAdjacentHTML除Firefox外,IE6/7/8/Safari/Chrome/Opera都支持。

c,window.external.AddFavorite用来在IE下添加到收藏夹。

d,window.sidebar.addPanel用来在FF下添加到收藏夹。

3,第三种很有趣,暂且称为 浏览器缺陷或bug 方式,即某些表现不是浏览器厂商刻意实现的。如下:

var isIE = !+"\v1";
var isIE = !-[1,];
var isIE = "\v"=="v";
isSafari=/a/.__proto__=='//';
isOpera=!!window.opera;

最经典的莫过于 !-[1,] 的判断方式,目前最少代码判断IE的方式,只需6个byte。这是个俄国人 发现的。利用了数组[1,]的length。还有来自英国的年轻 James Padolsey 利用IE条件注释
var ie = (function(){
    var undef,
        v = 3,
        div = document.createElement('div'),
        all = div.getElementsByTagName('i');    while (
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
        all[0]
    ); 
    return v > 4 ? v : undef
}());

被称为史上最有创意的IE判断。

注1:isIE = "\v" == "v" 方式IE9已经修复该bug,不能用此方式判断IE浏览器了(2010-6-29用IE9 pre3测试的)

Javascript 相关文章推荐
IE innerHTML,outerHTML所引起的问题
Jun 04 Javascript
javascript delete 使用示例代码
Mar 29 Javascript
IE6已终止操作问题的2种情况及解决
Apr 23 Javascript
原生JS绑定滑轮滚动事件兼容常见浏览器
Jun 30 Javascript
JavaScript中跨域调用Flash的方法
Aug 11 Javascript
jquery获取radio值(单选组radio)
Oct 16 Javascript
js日期插件dateHelp获取本月、三个月、今年的日期
Mar 07 Javascript
js中json处理总结之JSON.parse
Oct 14 Javascript
浅析如何利用JavaScript进行语音识别
Oct 27 Javascript
vue 使用鼠标滚动加载数据的例子
Oct 31 Javascript
Vue 数组和对象更新,但是页面没有刷新的解决方式
Nov 09 Javascript
JavaScript享元模式原理与用法实例详解
Mar 09 Javascript
Javascript 垃圾收集机制介绍理解
May 14 #Javascript
JavaScript实现GriwView单列全选(自写代码)
May 13 #Javascript
jquery实现漂浮在网页右侧的qq在线客服插件示例
May 13 #Javascript
js 程序执行与顺序实现详解
May 13 #Javascript
JS/jQuery实现默认显示部分文字点击按钮显示全部内容
May 13 #Javascript
JS 加入收藏夹的代码(主流浏览器通用)
May 13 #Javascript
jQuery实现长文字部分显示代码
May 13 #Javascript
You might like
php中神奇的fastcgi_finish_request
2011/05/02 PHP
phpmyadmin中禁止外网使用的方法
2014/11/04 PHP
浅谈php正则表达式中的非贪婪模式匹配的使用
2014/11/25 PHP
PHP原生函数一定好吗?
2014/12/08 PHP
PHP的RSA加密解密方法以及开发接口使用
2018/02/11 PHP
jquery入门——事件机制之事件中的冒泡现象示例解释
2020/09/12 Javascript
js仿百度有啊通栏展示效果实现代码
2013/05/28 Javascript
css样式标签和js语法属性区别
2013/11/06 Javascript
指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)
2014/02/21 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
2014/07/02 Javascript
使用cluster 将自己的Node服务器扩展为多线程服务器
2014/11/10 Javascript
JavaScript中遍历对象的property的3种方法介绍
2014/12/30 Javascript
用JavaScript实现页面重定向功能的教程
2015/06/04 Javascript
浅析AngularJS Filter用法
2015/12/28 Javascript
Bootstrap媒体对象的实现
2016/05/01 Javascript
canvas 画布在主流浏览器中的尺寸限制详细介绍
2016/12/15 Javascript
js以及jquery实现手风琴效果
2020/04/17 Javascript
Vue.js 2.0 移动端拍照压缩图片预览及上传实例
2017/04/27 Javascript
layui table 多行删除(id获取)的方法
2019/09/12 Javascript
微信小程序实用代码段(收藏版)
2019/12/17 Javascript
[00:52]DOTA2第二届亚洲邀请赛预选赛宣传片
2017/01/13 DOTA
python实现指定字符串补全空格、前面填充0的方法
2018/11/16 Python
python 获取微信好友列表的方法(微信web)
2019/02/21 Python
使用Python计算玩彩票赢钱概率
2019/06/26 Python
如何使用Python脚本实现文件拷贝
2019/11/20 Python
Python3.7在anaconda里面使用IDLE编译器的步骤详解
2020/04/29 Python
在Python中字典按值排序的实现方法
2020/11/12 Python
最好的商品表达自己:Cafepress
2019/09/04 全球购物
Chemist Warehouse中文网:澳洲连锁大药房
2021/02/05 全球购物
统计学专业毕业生的自我评价分享
2013/11/28 职场文书
电子信息专业自荐书
2014/02/04 职场文书
小学教师师德师风演讲稿
2014/08/22 职场文书
委托公证书样本
2015/01/23 职场文书
人事任命书范本
2015/09/21 职场文书
Python趣味爬虫之用Python实现智慧校园一键评教
2021/05/28 Python
springboot+rabbitmq实现智能家居实例详解
2022/07/23 Java/Android