一、EVENT 事件
1、什么是事件?
- 一个事件由什么东西组成
- 触发谁的事件:事件源 某个标签
- 触发什么事件:事件类型 onclick 点击
- 触发以后做什么:事件处理函数 写一个函数 执行这个操作
2、事件对象
- 就是你触发了一个事件(点击 双击 拖拽),对该事件的一些描述信息 比如在浏览器的位置 或者点击键盘或者那个按钮 -----对你的触发的事件进行精确描述的
-- 浏览器给了我们一个 **黑盒子**,叫做 `window.event`,就是对事件信息的所有描述
3、**兼容性问题**
- 在 `IE低版本` 里面这个东西好用,但是在 `高版本IE` 和 `Chrome` 里面不好使了
```javascript
oDiv.onclick = function (e) {
e = e || window.event e为高版本 window.event低版本
console.log(e.X轴坐标点信息)
console.log(e.Y轴坐标点信息)
}
```
4、点击事件的光标坐标点获取
- 例如:
- 相对事件源(你点击的元素)
- 相对页面
- 相对浏览器窗口
①相对于你点击的元素
- `offsetX` 和 `offsetY`
- 是相对于你点击的元素的边框内侧开始计算 (就是你的内容区 0,0)
②相对于浏览器窗口你点击的坐标点
- `clientX` 和 `clientY`
- 是相对于浏览器窗口来计算的,不管你页面滚动到什么情况,都是根据窗口来计算坐标(可视窗口的大小)
③相对于页面你点击的坐标点
- `pageX` 和 `pageY`
- 是相对于整个页面的坐标点,不管有