码迷,mamicode.com
首页 > Web开发 > 详细

js浏览器区别及检测

时间:2015-07-15 01:13:14      阅读:266      评论:0      收藏:0      [点我收藏+]

标签:

 1,ie,Safari,Opera,Chrome提供了screenLeft和screenTop属性,来取得窗口相对于屏幕左边和上边的位置
Firefox,Safari,Chrome提供了screenX和screenY属性表示相同的窗口位置,Opra虽然也支持这两个属性,但是并不对应screenLeft和screenTop.
var leftPos=(typeof window.screenLeft=="number")?window.screenLeft:window.screenX;
var topPos=(typeof window.screenTop=="number")?window.screenTop:window.screenY;
ie,Opera,Chrome中,screenLeft和screenTop中保存的是从屏幕左边和上边到页面可见区域的距离
Firefox和Safari中,保存的是整个浏览器窗口相对于屏幕的坐标值

 

2,

浏览器大小,Firefox,Safari,Opera和Chrome均为此提供了innerWidth,innerHeight,outerWidth和outerHeight返回浏览器窗口尺寸
Safari和Firefox中,outerWidth和outerHeight返回浏览器窗口本身的尺寸
Opera中,outerWidth和outerHeight返回的是可视区域加上边框的大小,innerWidth和innerHeight则表示该容器不包括边框的页面视图区大小
Chrome中,outerWidth,outerHeright与innerWidth,innerHeight返回相同的值,可视区域的大小
ie没有提供取得当前浏览器尺寸的属性,可以通过Dom取得可视区域大小
所以无法获取浏览器窗口大小,可以通过取得可视区域大小解决
浏览器均提供了document.documentElement.clientWidth和clientHeight保存页面的视口信息,在ie6中,这些属性必须在标准模式下才有效,如果是混杂模式,就必须通过document.body.clientWidth和document.body.clientHeight取得相同信息,混杂模式下的Chrome,则无论通过documentElement或者body都可以取得视口大小

var pageWidth=window.innerWidth,
pageHeight=window.innerHeight;
if (typeof pageWidth != "number"){
 if(document.compatMode=="CSS!Compat"){                                               
  pageWidth=document.documentElement.clientWidth;
  pageHeight=document.documentElement.clientHeight;
 }else{
  pageWidth=document.body.clientWidth;
  pageHeight=document.body.clientHeight;
 }
}

 

 

3,检测弹出窗口是否被屏蔽
var blocked=false;
try{
var wroxWin=window.open("http://www.wrox.com","_blank");
if(wroxWin==null){
blocked=true;
}
}catch(ex){
blocked=true;
}
if(blocked){
alert("The popup was blocked!");
}

 

4,使用setTimeout代替setInterval
var num=0;
var max=10;
function incrementNumber(){
num++;
if(num<max){
setTimeout(incrementNumber,500);
}else{
alert("Done")
}
}

 

 

 

 

 

完整的检测代码
var client=function(){
//呈现引擎
var engine={
ie:0,gecko:0,webkit:0,khtml:0,opera:0,
//完整版本号
var:null
};
//浏览器
var browser={
//主要浏览器
ie:0,firefox:0,konq:0,opera:0,chrome:0,safari:0,
//具体版本号
ver:null
};
//平台,设备和操作系统
var system={
win:false,
mac:false,
x11:false,
//移动设备
iphone:false,
ipod:false,
nokiaN:false,
winMobile:false,
macMobile:false,
//游戏系统
wii:false,
ps:false
};
//检测呈现引擎和浏览器
var ua=navigator.userAgent;
if(window.opera){
engine.ver=browser.ver=window.opra.version();
engine.opera=browser.opera=parseFloat(engine.ver);
}else if(/AppleWebKit\/(\S+)/.test(ua)){
engine.ver=RegExp["$1"];
engine.webkit=parseFloat(engine.ver);
 
//确定是chrome还是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{
//近似的确定版本号
var safariBersion=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.kon\=parseFloat(engine.ver);
}else if(/rv:([^\]+)\) Gecko\/\d{8}/.test(ua){
engine.ver=RegExp["$1"];
engine.gecko=parseFloat(engine.ver);
 
//确定是不是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);
}
 
//检测浏览器
browser.ie=engine.ie;
browser.opera=engine.opera;
 
//检测平台
var p=navigator.platform;
system.win=p.indexOf("Win")==0;
system.mac=p.indexOf("Mac")==0;
system.x11=(p=="x11") || (p.indexOF("Linux")==0);
 
//检测windows操作系统
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;
default:
system.win="Nt";
break;
}
}else if(RegExp["$1"]=="9x"){
sysytem.win="ME";
}else{
system.win=RegExp["$1"];
}
}
}
 
//移动设备
system.iphon\=ua.indexOf("iPhone")>--1;
system.ipod=ua.indexOf("iPod")>-1;
sysytem.nokiaN=ua.indexOF("NokiaN")>-1;
sysytem.winMobile=(system.win=="CE");
system.macMobile=(system.iphone || system.ipod);
 
//游戏系统
system.wii=ua.indexOf("Wii")>-1;
system.ps=/playstation/i.test(ua);
 
//返回对象
return{
engine:engine,
browser:browser,
system:system
};
}();
 
 
}

js浏览器区别及检测

标签:

原文地址:http://www.cnblogs.com/phpinfo/p/4646972.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!