JavaScript中几种常见的兼容问题及解决方案

2019-08-29 12:03:50 阅读：241 来源： 互联网

标签：function 兼容问题解决方案 JavaScript ele 事件 cb else type

　　在js中好用的东西一般都存在兼容问题，以下，我整理了一些常用的兼容处理方法，自己用的时候可以把他们放在一个JS文件中，需要用到时候直接引入，会比较方便.

一、获取非行内样式

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

【注】：这里arrt作为变量，要使用中括号语法。

二、事件对象的获取

//事件对象的获取兼容
function getEvent(ele){
    var e = ele || window.event;
}

三、事件冒泡

//事件冒泡的兼容
function stopBubble(e){
    if(e.stopPropagation){
        e.stopPropagation();
    }else {
        e.cancelBubble = true;
    }
}

四、阻止浏览器默认行为

//阻止默认事件的兼容
function prevent(eve){
    var e = eve || window.event;
    if(e.preventDefault){
        e.preventDefault();
    }else {
        e.event.returnValue = false;
    }
}

Tip:这里还有一种很简单的写法，在代码的最后一行加上return false；一定要注意的是，这句代码一定在所写事件的最后一行，不然后面的代码都执行不了，用的时候要注意。

五、事件绑定以及事件删除

　　1.监听式事件的绑定

//监听式绑定
function addEvent(ele,type,cb){
    if(ele.addEventListener){
        ele.addEventListener(type,cb);
    }else if(ele.attachEvent){
        ele.attachEvent("on"+type,cb);
    }else {
        ele["on" + type] = cb;
    }
}

　　2.监听式事件的删除

//删除绑定
function romoveEvent(ele,type,cb){
    if(ele.removeEventListener){
        ele.romoveEventListener(type,cb);
    }else if(ele.detachEvent){
        ele.detachEvent("on"+type,cb);
    }else {
        ele["on"+type] = null;
    }
}

六、键盘事件

//键盘检测兼容
function KeyC(eve){
    var e = eve || window.event;
    var keyc = e.keyCode || e.which;
    return keyc;
}

标签：function,兼容问题,解决方案,JavaScript,ele,事件,cb,else,type
来源： https://www.cnblogs.com/mengshou/p/11427642.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

JavaScript中几种常见的兼容问题及解决方案