原生JS方法个人总结(兼容性写法)

获取非行内样式的兼容 ✿ :

注释
1.style:获取行间样式。
2. currentStyle:获取计算后的样式,也叫当前样式、最终样式。
3. getComputedStyle(obj,false):在FF新版本中只需要第一个参数,即操作对象,第二个参数写“false”也是大家通用的写法,目的是为了兼容老版本的火狐浏览器。

//获取非行内样式的兼容
function getStyle(ele,attr){
    if(ele.currentStyle){
           return ele.currentStyle[attr];
    }else{
           return getComputedStyle(ele,false)[attr];
          }
    }             
         

获取行内样式的兼容 ✿ :

//获取行内样式的兼容
window.onload = function(){
     var oDiv = document.getElementById('div1');
     if(oDiv.currentStyle){
         //IE
          alert(oDiv.currentStyle.width);
     }else{
         //FF
          alert(getComputedStyle(oDiv,false).width);
          }
    };             
         

阻止浏览器默认事件的兼容 ✿ :

//阻止浏览器默认事件的兼容 
preventDefault: function(event){
        if (event.preventDefault){
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    }

阻止事件冒泡的兼容 ✿ :

//阻止事件冒泡的兼容 
stopPropagation: function(event){
        if (event.stopPropagation){
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    }

获取事件及事件对象目标 ✿ :

//获取事件及事件对象目标   
 getEvent: function(event){
     return event ? event : window.event;
 },
 //获取事件对象目标的兼容性写法
 getTarget: function(event){
     return event.target || event.srcElement;
 }

IE和标准下有哪些兼容性 ✿ :

//IE和标准下有哪些兼容性   
Var ev = ev || window.event  //事件问题
//网页可见区域
document.documentElement.clientWidth || document.body.clientWidth 
//事件源兼容
Var target = ev.srcElement||ev.target

原生JS方法个人总结(兼容性写法)_第1张图片

你可能感兴趣的:(个人总结)