-------------------------------关于浏览器兼容性问题-------------------------------------------

关于浏览器兼容性问题

1.主要的浏览器内核

webkit浏览器(chrome360等),firefox浏览器,opera浏览器,IE浏览器(IE9前后的区别,很关键

(后面的浏览器可以不记住内核名称)

2.浏览器版本检测

var userAgent = navigator.userAgent.toLowerCase(); 
// Figure out what browser is being used 
jQuery.browser = { 
version: (userAgent.match( /.+(?:rv|it|ra|ie)[/: ]([d.]+)/ ) || [])[1], 
safari: /webkit/.test( userAgent ), 
opera: /opera/.test( userAgent ), 
msie: /msie/.test( userAgent ) && !/opera/.test( userAgent ), 
mozilla: /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent ) 
}; 

http://www.jb51.net/article/31729.htm

3.IE的兼容模式

IE浏览器从IE8开始添加了兼容模式,开启后会以低版本的IE进行渲染。兼容模式有可能会导致网页显示出问题,于是我们通常在HTML中添加下列代码来使 IE 使用固定的渲染模式:

<metahttp-equiv="X-UA-Compatible"content="IE=8"><!--IE8模式渲染--> <metahttp-equiv="X-UA-Compatible"content="IE=7"><!--IE7模式渲染-->

http://www.jb51.net/css/88637.html

4.IE的怪异模式

ie6ie7ie8下,如果不声明DOCTYPE,在会触发怪异模式(quirks 模式)。

怪异模式是老版本,怪异模式通常模拟老式浏览器(比如Microsoft IE4 和Netscape Navigator4)的解析模式。

http://www.jb51.net/css/384176.html

5.IE8(及之前)浏览器事件绑定方式的不同

添加事件

//w3c标准

addEventListener(type, listener, useCapture);

//低版本的ie浏览器

attachEvent(type, listener);

删除事件

//w3c标准

removeEventListener(event,function,capture/bubble);

//低版本的ie浏览器

detachEvent(event,function);

解决方案:使用jqueryjQuery 2.0以前的版本)

6.ie7(及之前)的浏览器不支持png半透明效果

解决方案:使用滤镜实现或者做降级处理

7.IE8(及之前)的浏览器不支持H5CSS3IE9H5css3支持不全。

解决方案:降级处理

8.CSS3属性前缀问题

大部分主流浏览器支持W3C标准写法,部分浏览器(个别android手机浏览器)不支持W3C标准写法,需要加前缀,前缀包括-webkit -o -ms -moz

9.关于降级处理

在不支持h5css3的浏览器上通过其他替代方案,或者不进行实现,给用户以友好的提示,但是要尽量保证页面的美观和功能的完整性。

10.ajax的实现

w3c使用XMLHttpRequest , IE8(及之前)浏览器中使用ActiveXObject

 

11. ie各个版本hack

/*类内部hack*/

    .header {_100px;}            /* IE6专用*/

    .header {*+100px;}        /* IE7专用*/

    .header {*100px;}            /* IE6IE7共用*/

    .header {100px;}        /* IE8IE9共用*/

    .header {100px9;}        /* IE6IE7IE8IE9共用*/

    .header {330px9;}    /* IE9专用*/

/*选择器Hack*/

    *html .header{}        /*IE6*/ 

    *+html .header{}    /*IE7*/ 

原文地址:https://www.cnblogs.com/nan-3/p/6381975.html