事件对象与获取

事件对象与获取

• 事件对象 就是事件触发时，浏览器自动帮我们产生的一个对象
• 事件对象里面有事件触发时的相关信息，例如你是点击触发的事件，事件对象里就有你点击的位置坐标等

• 如何拿到事件对象？

• • 就是在事件绑定的回调函数里，写一个形参，这个形参就是事件对象
  • btn.addEventListener('click', function (形参) {
        
        // 这个形参就是事件对象
    })
  • • 事件对象这个形参名可以随便写，但是规范建议名字叫叫 e、ev、event

事件对象常用属性

• type

• • 获取事件类型，如果你是点击触发的事件，得到的是click，如果你是双击触发的事件，得到的就是 dblclick

• pageX / pageY

• • 是指获得元素到页面文档左上角的x和y距离

• clientX / clientY

• • 是指获得元素到可见区域左上角的x和y距离

• offsetX / offsetY

• • 获取是鼠标位置到触发元素自身左上角的x和y的距离

• key

• • 获得的是键盘按下的键是哪个键
  • 如果按的是a得到a，如果按的是b得到b，如果按的是回车得到Enter

• • 一般用在 keydown（键盘按下事件）和 keyup （键盘弹起事件）