Event事件对象,DOM2级方法

一.event事件对象

  • 每个浏览器中的event 
    鼠标坐标获取
  • event.pageX / event.pageY相对于文档顶部,不兼容低版本IE
  • event.clientX / event.clientY相对于可是区域

二.事件监听

  • attachEvent()IE8极其一下添加监听事件
  • addEventListener()大众浏览器添加监听事件

  • 事件绑定 
    1) 在DOM元素中直接绑定

    <input onclick = "alert('谢谢支持')" type="button" value="弹出警告"/>
    <input onclick = "fun()" type="button" value="警告">
    function fun(){
    alert("警告");
    }

    2)在javascript代码中绑定 
    就是一个对象的事件函数 
    3)绑定事件监听函数 
    就是上面两个方法来绑定事件监听函数

  • 事件解绑
  • 事件捕获 
    当鼠标点击或者触发dom事件时,浏览器会从根节点开始有外到内进行事件传播,即点击子元素,如果父元素通过事件捕获方式注册了对应的事件的话,会触发父元素绑定事件
  • 事件冒泡 
    与事件捕获相反,事件冒泡顺序是由内到外进行事件传播,直到根节点.

三.滚轮事件

  • wheelDelta正常记录滚动方向
  • detail火狐浏览器记录滚动条方向
  • onmousewheel滚轮滚动

四.事件冒泡

  • onmouseover / onmouseout
  • onmouseenter / onmouseleave不支持冒泡
  • 表格操作点击
  • cancelBubble从自身开始阻止冒泡
  • stopPropagation()阻止冒泡

五.键盘事件

  • keyCode
  • onkeydown
  • onkeypress
  • onkeyup
  • altKey
  • ctrlKey
  • shiftKey
  • which等

六.阻止浏览器默认事件

  • preventDefault
  • returnValue = false
  • 屏蔽浏览的右键菜单
  • 进制选中复制