浏览器兼容

首先，为什么要兼容浏览器？

不同的浏览器有不同的内核，即使同是IE浏览器，IE7和IE8也是不同的内核。内核不同，浏览器对同一段代码的表现就不同。

具体的兼容浏览器

HTML中的兼容

1.使用meta标签来调节浏览器的渲染方式

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome="1">

例如360双核浏览器就是在ie和chrome之间来回切换，代码如上。

2.ul标签在IE6/IE7中，有个默认的外边距，但是在IE8以上及其他浏览器中有默认的内边距。一般来说可链入common.css或者手动设置内外边距为0.

CSS中的兼容

1.IE8不支持rgba写法，但支持opacity；IE8不支持过渡，可使用JS实现；IE8不支持background-size；IE8不支持nth-child,但支持first-child和last-child；IE8不支持placeholder，可使用js插件jquery.JPlaceholder.js。

2.在使用绝对定位或者相对定位后，IE中设置z-index无效。因为因为其依赖父元素的z-index，但父元素默认是0。

3.IE双边距：浮动后有产生横向margin，该元素此时的外边距是其值的2倍。可使用display:block解决。

4.火狐阻止表单默认提交事件：在form中添加action="javascript:".

5.IE下遇到console时不识别报错，代码不会执行。可使用window.console方法。

6.IE下GET请求参数过长时会导致请求下载文件方法报错，可使用post。

7.IE8的new Date()返回NaN

function getDate(otherDate){
 var exp =/^s*(d{4})-(dd)-(dd)s*$/,
 date = new Date(NaN),month,
parts = exp.exec(otherDate);

if(parts){
  month =+ parts[2];
  date.setFullYear(parts[1].month-1,parts[3]);
  if(month != date.getMonth()+1){
  date.setTime(NaN);
}
}
return date;
}

8.css前缀

-moz-  火狐等使用Mozilla引擎的浏览器
-webkit- Safari,谷歌等使用Webkit引擎的浏览器
-o-   早期的Opera浏览器
-ms-   部分IE

Javascript中的兼容

1.标准浏览器事件绑定方法为addEventListener,IE是attachEvent.

2.标准浏览器的事件捕获方式是由外至内，IE为由内至外。以IE为准。

3.标准浏览器获取windown.event方法为event.target,IE为event.srcElement.

  嗯，嗯，，目前能想起来暂时就这么多啦啦啦啦啦