原生JS学习笔记（三）

本周学习总结如图。
同时要注意各种兼容问题，
1、兼容的封装：正常浏览器和IE8及以下:非行内样式的操作

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

2、赋值式事件的绑定的兼容:

eve || window.event

3、获取键盘按键的兼容：

e.keyCode || e.which

4、事件冒泡的兼容

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

5、取消浏览器默认事件的兼容

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

6、事件监听的兼容

function addEvent(ele,myevent,cb){
        if(ele.attachEvent){
            ele.attachEvent("on"+myevent,cb)            //IE
        }else{
            ele.addEventListener(myevent,cb,false)     //正常
        }
    }

7、事件委托的兼容

e.target || e.srcElement

8、事件委托的封装

function eveEnt(ele,cb){
        return function(eve){
            var e = eve || window.event;
            var target = e.target || e.srcElement;
            for(var i=0;i<ele.length;i++){
                if(target === ele[i]){
                    cb.bind(target)();
                }
            }
        }
    }

同时若是使用事件委托，尽量使用监听式事件绑定