web浏览器兼容简要整理

ajax的创建

        if (window.XMLHttpRequest) {
            var xhr = new XMLHttpRequest();
        } else {                                               //IE6及其以下版本浏览器
            var xhr = new ActiveXObject('Microsoft.XMLHTTP');
        }

事件监听

// target：监听对象
// type：监听函数类型，如click,mouseover
// func：监听函数

function addEventHandler(target,type,fn){

 if(target.addEventListener){

  //IE9，谷歌和火狐

  target.addEventListener(type, fn, false);

 }else if(target.attachEvent){

  target.attachEvent("on" + type, fn);

 }else{

  target["on" + type] = fn;

 }

} 

function removeEventHandler(target, type, fn) {       //移除

 if (target.removeEventListener){

  //IE9，谷歌和火狐

  target.removeEventListener(type, fn, false);

 } else if (target.detachEvent){

  target.detachEvent("on" + type, fn);

 }else {

  delete target["on" + type];

 } 

e||window.event

//阻止默认事件

function onclick (e){

var e=e||window.event

e.preventDefault();

}

//阻止冒

function stopPropagation(e) {

e = e || window.event;

if(e.stopPropagation) { //W3C阻止冒泡方法

e.stopPropagation();

} else {

e.cancelBubble = true; //IE阻止冒泡方法

}

}

    var e = e || window.event;
    var target = e.target || e.srcElement;//标准和Ie写法
   //事件源：被操作的那个元素
    target.nodeName
    
CSS

我们为了让页面形成统一的效果，要针对不同的浏览器或不同版本写出对应可解析的CSS样式，

我们把这个针对不同浏览器/版本而写CSS的过程叫做 CSS hack.

CSS hack主要有三种：IE条件注释法、CSS属性前缀法、选择器前缀法。

（1）IE条件注释法，即在正常代码之外添加判别IE浏览器或对应版本的条件注释，符合条件的浏览器或者版本号才回执行里边的代码。

<!--  lt是小于 gt是大于 lte是小于等于 gte是不小于 !是不等于 -->
<!-- [if IE]>
	你想要执行的代码
<![endif]-->
<!-- [if lt IE 8]>
	你想要执行的代码
<![endif]-->
<!-- [if ! IE 8]>
	你想要执行的代码
<![endif]-->

(2)CSS属性前缀法，即是给css的属性添加前缀。比如 * 可以被IE6/IE7识别，但 _ 只能被IE6识别，IE6-IE10都可以识别 "\9"，IE6不能识别!important  FireFox不能识别 * _  \9

(3)选择器前缀法。

IE6 *div{color:red;}
IE7 *+div{color:red;}

CSS reset
浏览器对标签的默认支持不同，所以我们要统一，就要进行CSS reset。 
最简单的初始化方法是 *{margin:0; padding:0;} 但不推荐，而且它也并不完善。