clientX/clientY

距离可视区域左上角

layerX/layerY

如果目标对象是定位方式，那么值与offset值相似
• 如果目标对象是非定位方式，取父容器的左上角位置，如果父容器未定位，继续向上取

offsetX/offsetY

相对事件目标对象的左上角位置

movementX/movementY

仅用于mousemove事件，这个值是鼠标移动时相对上次获取坐标的距离

pageX/pageY

相对页面顶端左上角位置

screenX/screenY

光标相对于该屏幕的水平位置（和页面无关）

x/y

和clientX/clientY相同

按下键点击鼠标时，变为true

• altKey: false
• ctrlKey: false
• metaKey: false
• shiftKey: false

针对mousedown事件的属性，判断按下的键

• button:
  buttons:
  which:
• 左键 001
• 中键 142
• 右键 223

MouseEvent

• click

  点击左键

dblclick

双击左键

mousedown

按下键

mouseup

松开

拓：mousedown,mouseup,click顺序

按下键（mousedown），松开（mouseup），点击（click ）

mousemove

移动

mouseout

滑出

有冒泡功能 可以收到鼠标滑入滑出子元素的冒泡事件

mouseover

滑过

有冒泡功能 可以收到鼠标滑入滑出子元素的冒泡事件

mouseenter

进入

仅对侦听的对象起到事件接收作用

mouseleave

离开

仅对侦听的对象起到事件接收作用

contextmenu

右键菜单

阻止默认事件

1、表单事件中的submit 和reset 使用阻止默认事件可以取消提交和重置

2、当使用contextmenu事件，取消鼠标右键菜单

3、当针对元素拖拽时，元素内有文本，文本会被选中

4、图片拖拽时产生禁止拖拽图标

this

指向

• 函数中

  this ==window

对象自身

var obj={ console.log(this)}

在事件函数中等于事件侦听的对象

document.addEventListener(“click”,clickHandler);function clickHandlere(){
console.log(this);
}

• 注：

  1、事件函数中的this会覆盖普通对象中函数this的指向

• 2、事件函数中，针对e.type事件类型所有对应的事件侦听对象才是this

焦距事件

blur

• 失去焦距

focus

• 汇聚焦距

e.relatedTarget

• 上次汇聚焦距的元素

汇聚焦距的方式有，点击，tab切换

所有表单元素（例：文本框），超链接

input事件

input

• e.data: “o” 输入的内容

• e.inputType: “insertText” 输入的类型 insertCompositionText

  包括插入文本，删除文本，插入输入法文本，剪切粘贴文本等等

e.isComposing: true 是否是输入法文本