JS兼容性笔记--持续更新

JS兼容性笔记

1.IE8不支持getClassName

hack:不支持就给它创建这个方法

if(!document.getElementByClassName){
    document.getElementByClassName = function(classname){
        var all = document.getElementByTagName("*");
        var newarr = [];
        for( var i = 0; i<all.length; i++){
            var classList = all[i].className.split(/\s+/);
            var flag = false;
            for(var j = 0; j<classList.length; j++){
                if(classList[j] == classname){
                    return true;
                }
            }
            if(flag){
                newarr.push(all[i]);
            }
        }
        return newarr;
    }
}

2.获取非行内样式的style的兼容写法

var fillDiv = document.getElementById("filldiv");
var 属性名 = fillDiv.currentStyle  ?  fillDiv.currentStyle.width  :  getComputedStyle(fillDiv).width

【tips】JS获取非行内样式的style，用getComputedStyle(id名).属性名，只是获取，不耽误更改。
将上面的fillDiv.currentStyle换成VBArray也可以。

3.获取Event事件对象

xxxx.onclick = function(evt){
    var e = evt || window.event;
}

老版本的IE：e不是由参数传进去的，用的时候直接在内部直接写window.event

4.键盘事件-获取键盘码keycode

xxxx.onclick = function(evt){
    var keycode = e.keyCode || e.which;
}

5.阻止事件传播

e.stopPropagation ? e.stopPropagration : e.cancelBubble = true;

ie里面不支持stopPropagation

6.添加事件监听

//兼容写法
function addEvent(ele, eventtype, fn, isCapture){
               if(ele.addEventListener){//window.VBArray,IE11已经不支持attachEvent,但是仍然支持window.VBArray，会报错，所以不用它当判断条件
                    ele.addEventListener(eventtype, fn, 
isCapture);
               }else{
                    ele.attachEvent("on" + eventtype, fn);
               }
          }

标准写法：xxx.addEventListener(“mouseover”, function(){}, true);

IE写法：xxx.attachEvent(“onclick”, function(){});