02.12事件绑定

JS是事件驱动语言

• 1.事件三要素：事件源、事件、事件驱动程序

• 2.绑定事件

  • a。 直接通过标签绑定事件-直接在事件对应的属性里面写js代码

  • b. 直接通过标签绑定事件 - 直接在事件对应的属性里写调用函数，这个函数中的this是window

  • c. 直接通过标签绑定事件 - 直接在事件对应的属性里写调用函数，函数中的this是window

  • d.鼠标进入事件绑定函数 onmouseover

  • e.通过节点绑定事件
    节点。addEventListener(事件名，事件驱动程序)
    事件名：去掉事件名前面的on onclick->click
    这种绑定方式绑定事件，可以给同一个事件源绑定一个不同的驱动程序

• 3.驱动程序中的evt参数，代表事件对象

• 4.事件冒泡

  • 子标签上产生的事件，会传递给父标签，意思就是全部标签都会发生事件

• 5.事件捕获

  • 让事件不再向下传递
  • evt.stopPropagation
  • onclick(function(evt){evt.stopPropagation})，不传递给父节点

    var div1 = document.getElementsByTagName('div');
    div1[0].addEventListener('m',function(evt){
        console.log(evt);
        if(evt.layerX<200){
            console.log(evt.layerX);
            console.log(evt);
        }
    })````