2020-11-15添加事件和事件对象

添加事件和事件对象

  • 元素.on事件名

  • 注意:

    • 事件不可绑定多个,后面绑定的会覆盖前面的
  • 格式:

    let oBtn=document.querySelector("button");
    oBtn.onclick=function () {
        alert(123);
    }
    

  • addEventListener

  • 注意:

    • IE9以上才可使用
    • 事件不加on
    • 事件可绑定多个
  • 格式:

    let oBtn=document.querySelector("button");
    oBtn.addEventListener("click", function () {
        alert(123);
    })
    

  • attachEvent

  • 注意:

    • IE9以下才可使用
    • 事件可绑定多个,后绑定的先执行
  • 格式:

    let oBtn=document.querySelector("button");
    oBtn.attachEvent("onclick",function () {
        alert(123);
    });
    

  • 兼容写法:

    //addEvent(元素,事件名,回调函数)
    function addEvent(ele, name, fn) {
        if (ele.addEventListener) {
            ele.addEventListener(name, fn);
        } else {
            ele.attachEvent("on" + name, fn);
        }
    }
    

  • 事件对象

  • 兼容写法:event = event || window.event

  • 格式:

    123
    
    

你可能感兴趣的:(2020-11-15添加事件和事件对象)