zoukankan      html  css  js  c++  java
  • JavaScript中几种常见的兼容问题及解决方案

      在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;
    }
  • 相关阅读:
    Java JDK和IntelliJ IDEA 配置及安装
    来吧学学.Net Core之登录认证与跨域资源使用
    来吧学学.Net Core之项目文件简介及配置文件与IOC的使用
    【转载】任正非:我的父亲母亲
    HTTP协议中的短轮询、长轮询、长连接和短连接
    跨域资源共享CORS详解
    C#各个版本中的新增特性详解
    仓央嘉措不负如来不负卿
    Redis Sentinel实现的机制与原理详解
    Redis的发布订阅及.NET客户端实现
  • 原文地址:https://www.cnblogs.com/mengshou/p/11427642.html
Copyright © 2011-2022 走看看