频道系统缓慢进行中,今天完善了一下有关效果变化的JS,都比较简单,但之前Chrome发生了问题一直没有去解决,用alert和try发现原来是我的浏览器判断函数出现了问题,chrome下出现了奇怪的未定义错误。还好,一直想找一个完整的浏览器判断方法。
浏览器判断其实并不被推崇,大多数方法都是用到了navigator.userAgent,容易出现问题、判断错误,很多高手推荐功能判断而不是版本判断。恩,不过有情况下直接能判断出浏览器和版本号确实会很方便,很多Js库也是提供了一些类似的浏览器判断方法。
好吧,看看我从网上找来的……注释有些是我添加的,是对原作者代码的测试结果
【10-31 14:12 进行了更新,对IE条件编译部分进行了修正】
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | ie = !+"\v1" ; //可行 ie ='\v'=='v' ;//可行,以前用过,传说最短的判断IE代码,貌似没上面那条短 ie = 0//@cc_on+1;//不可行,这样写就会语法错误了,我修改如下 ie = 0/*@cc_on+1@*/; ie = !!top.execScript;//Chrome也支持,所以不能用 ie = /*@cc_on!@*/!1;//可行,条件编译 ie8 = !!window.XDomainRequest;//可行 //如果是IE,会返回6,7,8代表ie6,ie7,ie8,否则返回1 IEVersion = (" " + (/*@cc_on @_jscript_version @*/-1)).slice(-1)//可用 //基于条件编译的嗅探脚本,还有如下几个:(实际使用这些都有错误) IE8=@cc_on @_jscript_version == 5.8 ? true : @false IE7=@cc_on @_jscript_version == 5.7 ? true : @false IE6=@cc_on @_jscript_version == 5.6 ? true : @false IE55=@cc_on @_jscript_version == 5.5 ? true : @false //10-31添加 //我进行了改写,测试可行 ie6 = /*@cc_on @_jscript_version == 5.6 ||@*/false; ie7 = /*@cc_on @_jscript_version == 5.7 ||@*/false; ie8 = /*@cc_on @_jscript_version == 5.8 ||@*/false; ie5 = /*@cc_on @_jscript_version == 5.5 ||@*/false; ff = /a/[-1]=='a';//可行 //下面不推荐了,ff2的代码在ff3也能通过,再加上除IE外的浏览器版本判断并不重要 ff3 = (function x(){})[-5]=='x'; ff2 = (function x(){})[-6]=='x'; safari=/a/.__proto__=='//';//可行 safari = window.openDatabase;//不可行,chrome也支持 chrome=/source/.test((/a/.toString+''));//可行 opera=!!window.opera ;//这个很熟悉了 opera=/^function (/.test([].sort);//不可行…… |
下面是作者提供的判断函数,未测试,看起来ff测试就不准确了
1 2 | B=(function x(){})[-5]=='x'?'FF3':(function x(){})[-6]=='x'?'FF2':/a/[-1]=='a'?'FF':'\v'=='v'?'IE': /a/.__proto__=='//'?'Saf':/s/.test(/a/.toString)?'Chr':/^function \(/.test([].sort)?'Op':'Unknown' |
作者还给出了EXT的相关代码,权当一个参考吧,这是传统的判断方法,但很全面
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | ua = navigator.userAgent.toLowerCase(), check = function(r){ return r.test(ua); }, isOpera = check(/opera/); isChrome = check(/chrome/); isWebKit = check(/webkit/); isSafari = !isChrome && check(/safari/); isSafari2 = isSafari && check(/applewebkit\/4/);// unique to Safari 2 isSafari3 = isSafari && check(/version\/3/); isSafari4 = isSafari && check(/version\/4/); isIE = !isOpera && check(/msie/); isIE7 = isIE && check(/msie 7/); isIE8 = isIE && check(/msie 8/); isIE6 = isIE && !isIE7 && !isIE8; isGecko = !isWebKit && check(/gecko/); isGecko2 = isGecko && check(/rv:1\.8/); isGecko3 = isGecko && check(/rv:1\.9/); |
最流行的Jquery也有,但1.3内好像没有支援chrome,想看的朋友,打开JS看一下吧,就不帖出来了
然后是我整理的代码
1 2 3 4 5 6 7 8 9 10 11 12 | browsers : { ieVer : (" " + (/*@cc_on @_jscript_version @*/-1)).slice(-1), ie5 : /*@cc_on @_jscript_version == 5.5 ||@*/false, ie6 : /*@cc_on @_jscript_version == 5.6 ||@*/false, ie7 : /*@cc_on @_jscript_version == 5.7 ||@*/false, ie8 : /*@cc_on @_jscript_version == 5.8 ||@*/false, ie : '\v'=='v', ff : /a/[-1]=='a', safari : /a/.__proto__=='//', chrome : /source/.test((/a/.toString+'')), opera : !!window.opera } |
还有我之前在chrome中出现错误的方法,可以看到例如ie判断还是比较实用的,因为ActiveXObject仅在ie下有效,而这个方法也结合了版本判断(但注意代码中有错误!)
1 2 3 4 5 | ie : window.ActiveXObject ? navigator.userAgent.toLowerCase().match(/msie ([\d.]+)/)[1] : 0, firefox : document.getBoxObjectFor ? navigator.userAgent.toLowerCase().match(/firefox\/([\d.]+)/)[1] : 0, chrome : window.MessageEvent && !document.getBoxObjectFor ? navigator.userAgent.toLowerCase().match(/chrome\/([\d.]+)/)[1] : 0, safari : window.openDatabase ? navigator.userAgent.toLowerCase().match(/version\/([\d.]+)/)[1] : 0, opera : window.opera ? navigator.userAgent.toLowerCase().match(/opera.([\d.]+)/)[1] : 0 |
Ok,总结了很多,实际上不同浏览器的私有属性和方法很多,可以慢慢挖掘,找到更好的方法,或者干脆摆脱这些判断函数,当然前提是你对各个浏览器十分了解拥有很强的JS编程功底。
文中部分内容转载自:http://www.cnblogs.com/rubylouvre/archive/2009/10/14/1583362.html 感谢原作者的无私奉献
补充:有关Js条件编译 http://www.blueidea.com/tech/web/2006/3238.asp
[...] 《Javascript浏览器判断终极技巧》 《JavaScript 判断浏览器类型及版本》 (以上两文总结得都很不错, 只是 [...]
[...] 而我的这篇文章 Javascript浏览器判断终极技巧已经落后于现在的浏览器发展,非常惭愧的是当时写上了终极技巧这四个字 [...]