兼容-js

每个浏览器不同的内核，不同的处理引擎，不同的渲染引擎就会导致写同一条样式的时候出现差异，这个现象叫做兼容。

• 事件对象兼容：

let e = evt || event     //凡是使用到事件的时候无脑兼容

• 阻止事件冒泡的兼容：

//三元写法
e.stopPropagation?e.stopPropagation():e.cancelBubble = true;  
//对事件的触发源添加该方法.stopPropagation(); 

//if
function stopBubble(e){
    if(e.stopPropagation){
        e.stopPropagation();
    }else{
        e.cancelBubble = true;
    }
}

取消事件冒泡有两种方式：

标准的W3C
方式：e.stopPropagation();这里的stopPropagation是标准的事件对象的一个方法，调用即可（谷歌和火狐支持,IE不支持）
非标准的IE方式:window.event.cancelBubble=true;这里的cancelBubble是IE事件对象的属性，设为true就可以了（IE特有的,谷歌支持,火狐不支持）

• 阻止浏览器默认行为

e.preventDefault? e.preventDefault() : e.returnValue = false;

//
function stopDefault(e){
    if(e.preventDefault){
        e.preventDefault()
    }else{
        e.returnValue = false;
    }
}

• 获取真实事件源：

//高级浏览器：e.target
//IE浏览器：e.srcElement
//兼容处理：var tar = e.target || e.srcElement;
let target = e.srcElement || e.target ;

//函数可直接引用写法
function fn(eve){
    var  e=eve|| window.event;
    e.target ||e.srcElement;
}

• 获取滚动条高度：

let _top = document.documentElement.scrollTop || document.body.scorllTop;

• 键盘字符兼容：

//高级浏览器：eve.keyCode
//IE浏览器：eve.which
//兼容处理：var code = eve.keyCode || eve.which;

//三元
let key = e.keyCode || e.charCode || e.which；

//函数直接引用
document.onkeypress=function(eve){
    var  e=eve|| window.event;
    e.keyCode||e.which;
}

• 获取非行内样式的兼容

function getStyle(ele,attr){
    if(ele.currentStyle){
        return ele.currentStyle[attr];
    }else{
        return getComputedStyle(ele,false)[attr];
    }
}

• 关于事件监听移除的兼容

if (e.removeEventListener){
    e.removeEventListener(事件,事件处理函数,false)
}else{
    e.detachEvent("on"+事件,事件处理函数);
}

• 事件委托的封装没懂要用在哪里目前没用到过

oul.onclick=fn(achild,callback);        
function fn(achild,callback){
   return function(eve){
        var  e=eve|| window.event;
        //事件源的兼容
        var target=eve.target||eve.srcElement;
        for(var i=0;i<achild.length;i++){
            if(child===target){
                callback.bind(target)();   //把自身绑定到事件源返回，此时回调函数的this就是事件源
             }
        }
    }
}

---

链接类

• ie

---

汇总引用的博主
版权声明：本文为CSDN博主「FunEnjoy」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/Fun_Enjoy/article/details/102509284

版权声明：本文为CSDN博主「Laueeo」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_45855662/article/details/122413003

http://t.csdn.cn/QX9ZO