(跨浏览器基础事件/浏览器检测/判断浏览器)经验代码分享

跨浏览器基础事件

//跨浏览器添加事件 
function addEvent(obj, type, fn) { 
if (obj.addEventListener) { 
obj.addEventListener(type, fn, false); 
} else if (obj.attachEvent) { 
obj.attachEvent('on' + type, function () { 
fn.call(obj); 
}); 
} 
} 
//跨浏览器基础事件 
function removeEvent(obj, type, fn) { 
if (obj.removeEventListener) { 
obj.removeEventListener(type, fn, false); 
} else if (obj.detachEvent) { 
obj.detachEvent('on' + type, fn); 
} 
} 
//跨浏览器阻止默认行为 
function preDef(evt) { 
var e = evt || window.event; 
if (e.preventDefault) { 
e.preventDefault(); 
} else { 
e.returnValue = false; 
} 
} 
//跨浏览器获取目标对象 
function getTarget(evt) { 
if (evt.target) { //W3C 
return evt.target; 
} else if (window.event.srcElement) { //IE 
return window.event.srcElement; 
} 
} 
//跨浏览器获取字符编码 
function getCharCode(evt) { 
var e = evt || window.event; 
if (typeof e.charCode == 'number') { 
return e.charCode; 
} else { 
return e.keyCode; 
} 
}

浏览器检测

var client = function(){ 
//rendering engines 
var engine = { 
ie: 0, 
gecko: 0, 
webkit: 0, 
khtml: 0, 
opera: 0, 
//complete version 
ver: null 
}; 
//browsers 
var browser = { 
//browsers 
ie: 0, 
firefox: 0, 
safari: 0, 
konq: 0, 
opera: 0, 
chrome: 0, 
//specific version 
ver: null 
}; 
//platform/device/OS 
var system = { 
win: false, 
mac: false, 
x11: false, 
//mobile devices 
iphone: false, 
ipod: false, 
ipad: false, 
ios: false, 
android: false, 
nokiaN: false, 
winMobile: false, 
//game systems 
wii: false, 
ps: false 
}; 
//detect rendering engines/browsers 
var ua = navigator.userAgent; 
if (window.opera){ 
engine.ver = browser.ver = window.opera.version(); 
engine.opera = browser.opera = parseFloat(engine.ver); 
} else if (/AppleWebKit\/(\S+)/.test(ua)){ 
engine.ver = RegExp["$1"]; 
engine.webkit = parseFloat(engine.ver); 
//figure out if it's Chrome or Safari 
if (/Chrome\/(\S+)/.test(ua)){ 
browser.ver = RegExp["$1"]; 
browser.chrome = parseFloat(browser.ver); 
} else if (/Version\/(\S+)/.test(ua)){ 
browser.ver = RegExp["$1"]; 
browser.safari = parseFloat(browser.ver); 
} else { 
//approximate version 
var safariVersion = 1; 
if (engine.webkit < 100){ 
safariVersion = 1; 
} else if (engine.webkit < 312){ 
safariVersion = 1.2; 
} else if (engine.webkit < 412){ 
safariVersion = 1.3; 
} else { 
safariVersion = 2; 
} 
browser.safari = browser.ver = safariVersion; 
} 
} else if (/KHTML\/(\S+)/.test(ua) || /Konqueror\/([^;]+)/.test(ua)){ 
engine.ver = browser.ver = RegExp["$1"]; 
engine.khtml = browser.konq = parseFloat(engine.ver); 
} else if (/rv:([^\)]+)\) Gecko\/\d{8}/.test(ua)){ 
engine.ver = RegExp["$1"]; 
engine.gecko = parseFloat(engine.ver); 
//determine if it's Firefox 
if (/Firefox\/(\S+)/.test(ua)){ 
browser.ver = RegExp["$1"]; 
browser.firefox = parseFloat(browser.ver); 
} 
} else if (/MSIE ([^;]+)/.test(ua)){ 
engine.ver = browser.ver = RegExp["$1"]; 
engine.ie = browser.ie = parseFloat(engine.ver); 
} 
//detect browsers 
browser.ie = engine.ie; 
browser.opera = engine.opera; 
//detect platform 
var p = navigator.platform; 
system.win = p.indexOf("Win") == 0; 
system.mac = p.indexOf("Mac") == 0; 
system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); 
//detect windows operating systems 
if (system.win){ 
if (/Win(?:dows )?([^do]{2})\s?(\d+\.\d+)?/.test(ua)){ 
if (RegExp["$1"] == "NT"){ 
switch(RegExp["$2"]){ 
case "5.0": 
system.win = "2000"; 
break; 
case "5.1": 
system.win = "XP"; 
break; 
case "6.0": 
system.win = "Vista"; 
break; 
case "6.1": 
system.win = "7"; 
break; 
default: 
system.win = "NT"; 
break; 
} 
} else if (RegExp["$1"] == "9x"){ 
system.win = "ME"; 
} else { 
system.win = RegExp["$1"]; 
} 
} 
} 
//mobile devices 
system.iphone = ua.indexOf("iPhone") > -1; 
system.ipod = ua.indexOf("iPod") > -1; 
system.ipad = ua.indexOf("iPad") > -1; 
system.nokiaN = ua.indexOf("NokiaN") > -1; 
//windows mobile 
if (system.win == "CE"){ 
system.winMobile = system.win; 
} else if (system.win == "Ph"){ 
if(/Windows Phone OS (\d+.\d+)/.test(ua)){; 
system.win = "Phone"; 
system.winMobile = parseFloat(RegExp["$1"]); 
} 
} 
//determine iOS version 
if (system.mac && ua.indexOf("Mobile") > -1){ 
if (/CPU (?:iPhone )?OS (\d+_\d+)/.test(ua)){ 
system.ios = parseFloat(RegExp.$1.replace("_", ".")); 
} else { 
system.ios = 2; //can't really detect - so guess 
} 
} 
//determine Android version 
if (/Android (\d+\.\d+)/.test(ua)){ 
system.android = parseFloat(RegExp.$1); 
} 
//gaming systems 
system.wii = ua.indexOf("Wii") > -1; 
system.ps = /playstation/i.test(ua); 
//return it 
return { 
engine: engine, 
browser: browser, 
system: system 
}; 
}();

判断浏览器的名称、版本号、操作系统

var BrowserDetect = { 
init: function () { 
this.browser = this.searchString(this.dataBrowser) || "An unknown browser"; 
this.version = this.searchVersion(navigator.userAgent) 
|| this.searchVersion(navigator.appVersion) 
|| "an unknown version"; 
this.OS = this.searchString(this.dataOS) || "an unknown OS"; 
}, 
searchString: function (data) { 
for (var i=0;i<data.length;i++) { 
var dataString = data[i].string; 
var dataProp = data[i].prop; 
this.versionSearchString = data[i].versionSearch || data[i].identity; 
if (dataString) { 
if (dataString.indexOf(data[i].subString) != -1) 
return data[i].identity; 
} 
else if (dataProp) 
return data[i].identity; 
} 
}, 
searchVersion: function (dataString) { 
var index = dataString.indexOf(this.versionSearchString); 
if (index == -1) return; 
return parseFloat(dataString.substring(index+this.versionSearchString.length+1)); 
}, 
dataBrowser: [ 
{ 
string: navigator.userAgent, 
subString: "Chrome", 
identity: "Chrome" 
}, 
{ string: navigator.userAgent, 
subString: "OmniWeb", 
versionSearch: "OmniWeb/", 
identity: "OmniWeb" 
}, 
{ 
string: navigator.vendor, 
subString: "Apple", 
identity: "Safari", 
versionSearch: "Version" 
}, 
{ 
prop: window.opera, 
identity: "Opera", 
versionSearch: "Version" 
}, 
{ 
string: navigator.vendor, 
subString: "iCab", 
identity: "iCab" 
}, 
{ 
string: navigator.vendor, 
subString: "KDE", 
identity: "Konqueror" 
}, 
{ 
string: navigator.userAgent, 
subString: "Firefox", 
identity: "Firefox" 
}, 
{ 
string: navigator.vendor, 
subString: "Camino", 
identity: "Camino" 
}, 
{ // for newer Netscapes (6+) 
string: navigator.userAgent, 
subString: "Netscape", 
identity: "Netscape" 
}, 
{ 
string: navigator.userAgent, 
subString: "MSIE", 
identity: "Internet Explorer", 
versionSearch: "MSIE" 
}, 
{ 
string: navigator.userAgent, 
subString: "Gecko", 
identity: "Mozilla", 
versionSearch: "rv" 
}, 
{ // for older Netscapes (4-) 
string: navigator.userAgent, 
subString: "Mozilla", 
identity: "Netscape", 
versionSearch: "Mozilla" 
} 
], 
dataOS : [ 
{ 
string: navigator.platform, 
subString: "Win", 
identity: "Windows" 
}, 
{ 
string: navigator.platform, 
subString: "Mac", 
identity: "Mac" 
}, 
{ 
string: navigator.userAgent, 
subString: "iPhone", 
identity: "iPhone/iPod" 
}, 
{ 
string: navigator.platform, 
subString: "Linux", 
identity: "Linux" 
} 
] 
}; 
BrowserDetect.init(); 
alert(BrowserDetect.browser); //名称 
alert(BrowserDetect.version); //版本 
alert(BrowserDetect.OS) //系统